როგორ ვრცელდება ვებსაიტის ფონი

Სარჩევი:

როგორ ვრცელდება ვებსაიტის ფონი
როგორ ვრცელდება ვებსაიტის ფონი

ვიდეო: როგორ ვრცელდება ვებსაიტის ფონი

ვიდეო: როგორ ვრცელდება ვებსაიტის ფონი
ვიდეო: საიტის დამზადება, ინტერნეტმაღაზიის აწყობა WordPress-ის ძრავაზე, ვებსაიტის შექმნა (ვიდეოკურსი) 2024, მაისი
Anonim

HTML მარკირების ენა საშუალებას აძლევს ვებდიზაინერს გამოიყენოს ნებისმიერი სურათი, როგორც ფონის სურათი. ამასთან, თავად ენას არ გააჩნია ჩამონტაჟებული მართვის საშუალებები ფონის სურათებისათვის. უფრო სრულყოფილი რეგულირება ხდება კასკადური CSS სტილის ცხრილების გამოყენებით.

როგორ ვრცელდება ვებსაიტის ფონი
როგორ ვრცელდება ვებსაიტის ფონი

ინსტრუქციები

Ნაბიჯი 1

იმისათვის, რომ ფონი გადაჭიმული იყოს ბრაუზერის მთელ სიგანეზე, უნდა გამოიყენოთ z-index პარამეტრი თქვენს CSS– ში. ეს საშუალებას გაძლევთ დაადგინოთ თქვენს მიერ შექმნილი ელემენტების თანმიმდევრობა. რაც უფრო მაღალია ამ ატრიბუტის მნიშვნელობა, მით უფრო მაღალი ბლოკი განთავსდება გვერდზე.

ნაბიჯი 2

შექმენით ახალი დოკუმენტები html და css ფორმატში (მაუსის მარჯვენა ღილაკი - "ახალი" - "ტექსტური ფაილი") და გახსენით ისინი ნებისმიერი ტექსტური რედაქტორის გამოყენებით.

ნაბიჯი 3

განათავსეთ ფონის სურათი ქვედა ფენაზე. ის გაიჭიმება, ეკრანის გარჩევადობის მიხედვით. ზედა ნაწილში განთავსდება კიდევ ერთი ელემენტი, რომელზეც გამოჩნდება გვერდის შინაარსი. ამისათვის შექმენით ორი ბლოკი. Css ფაილში ჩაწერეთ:.1 შრე {z-index: 1; სიგანე: 100% სიმაღლე: 100% პოზიცია: აბსოლუტური;}. 2 ფენა {პოზიცია: აბსოლუტური; z- ინდექსი: 2; } პოზიცია: აბსოლუტური პარამეტრი საშუალებას გაძლევთ დააყენოთ აბსოლუტური პოზიციონირება, ე.ი. ფენა განთავსდება სხვა ელემენტებისგან დამოუკიდებლად.

ნაბიჯი 4

შეიტანეთ გენერირებული CSS კოდი HTML ფაილში ბმულის ტეგის გამოყენებით: გვერდის ფონი

ნაბიჯი 5

შექმენით ახალი ფენა. ტეგის გამოყენება

განათავსეთ სურათი. მაგალითად: გვერდის შინაარსი img- სთვის მხოლოდ სიგანის პარამეტრია მითითებული, რადგან თუ დამატებით მიუთითებთ სიმაღლეს, ზოგიერთ ბრაუზერში გამოჩნდება სურათის დამახინჯება.

ნაბიჯი 6

შეინახეთ თქვენი ცვლილებები. თქვენი კოდის შესამოწმებლად გაზარდეთ გვერდი თქვენი ბრაუზერის ფანჯარაში. ფონის სურათი ასევე უნდა გაიზარდოს.

გირჩევთ: