გამოიყენეთ CSS ვებ გვერდის გარეგნობის დასაზუსტებლად.
ვებ გვერდის კოდიერი იყენებს ჰიპერტექსტის მარკირების ენას, რათა ბრაუზერს უთხრას გვერდზე თითოეული ელემენტის ფუნქციონალური დანიშნულება, როგორიცაა აბზაცი, სათაური ან სია. HTML 4-დან მოყოლებული, კასკადური სტილის ფურცლები უზრუნველყოფდა კოდირებს იმის საშუალებას, რომ ბრაუზერს ეთქვა, როგორ უნდა გამოიყურებოდეს თითოეული ეს ელემენტი, განურჩევლად იმისა, თუ რა არის ისინი. გვერდს შეიძლება ჰქონდეს სხვადასხვა CSS სტილი სხვადასხვა ტიპის მოწყობილობებისთვის, როგორიცაა მობილური ტელეფონები და დესკტოპ კომპიუტერები, რაც საშუალებას იძლევა შეიცვალოს გვერდის გარეგნობა HTML-ის შეცვლის გარეშე. გამოიყენეთ CSS თვისებები სურათის ცენტრისთვის.
Ნაბიჯი 1
მოათავსეთ "img" ტეგი HTML ფაილში, სადაც გსურთ თქვენი სურათი გამოჩნდეს ვებ გვერდზე. ის უნდა იყოს "body" ტეგებს შორის და "h1" ტეგების შემდეგ. Მაგალითად,
დღის ვიდეო
ეს შენი ტექსტია.
განსაზღვრავს სურათს სახელად photo.jpg, რომლის სიგანეა 170 პიქსელი და სიმაღლე 50 პიქსელი. ის პირველია გვერდზე ზედა სათაურის შემდეგ.
ნაბიჯი 2
გამოიყენეთ "ზღვარი" CSS ატრიბუტი გვერდის ელემენტების გარშემო სივრცის დასადგენად, როგორიცაა სურათები. "auto" მნიშვნელობა margin ატრიბუტისთვის ეუბნება ვებ ბრაუზერს ავტომატურად განსაზღვროს სივრცის რაოდენობა. Ისე,
განსაზღვრავს, რომ სურათის გარშემო სივრცე განისაზღვრება ბრაუზერის მიერ.ნაბიჯი 3
გამოიყენეთ "display" თვისება, რათა განისაზღვროს, თუ როგორ არის ნაჩვენები გვერდის ელემენტი. ეკრანის თვისების "ბლოკის" მნიშვნელობა ეუბნება ვებ ბრაუზერს, აჩვენოს ელემენტი საკუთარ ხაზზე, მის ზემოთ და ქვემოთ სივრცეში. Ისე, განსაზღვრავს იგივე სურათს, მაგრამ დამატებით "ჩვენება: ბლოკი;" ახლა ათავსებს მას საკუთარ ხაზზე.
ნაბიჯი 4
იხილეთ ვებ გვერდი რამდენიმე სხვადასხვა ბრაუზერში, რათა დაადასტუროთ, რომ სურათი სწორად არის ცენტრში.
რჩევა
ჩართეთ სურათის აღწერა "alt" ტეგში. ეს თქვენს გვერდს უფრო ხელმისაწვდომს ხდის მხედველობის დაქვეითებული მკითხველებისთვის და უზრუნველყოფს თქვენი კოდის სტანდარტებს.
