Cum să setați un fundal în HTML

Adăugarea unei imagini de fundal pe pagina dvs. poate ajuta la înfrumusețarea aspectului. În acest articol scurt, sunt afișați pașii de bază pentru adăugarea unui fundal la o pagină HTML. Aici puteți combina CSS (Caseta de stil cascadă

conținut

Pași
Tipuri de stiluri
Sfaturi
Avertismente

) la HTML pentru a obține unele rezultate destul de cool. HTML (HyperText Markup Language) este folosită pentru a crea structura unei pagini, în timp ce CSS îi dă un stil - totuși, fără HTML nu vom avea nimic de stil.

pași

Deschideți fișierul principal.css în editorul tău. Fișierul principal conține lista cu toate clasele sau codurile care aparțin zonei principale de conținut din pagină în ordine alfabetică. Aceste clase nu ar trebui să fie deturnate. Apoi ID-urile vor fi listate după clase și vor fi listate și în ordine alfabetică.

Nu presupuneți că acest lucru va funcționa: Multe pagini oferă suprapuneri DIV prefabricate și vă instruiesc cu privire la utilizarea imaginilor dvs. și unde să "lipiți" tipul de cod oferit.
Înțelegeți că structura paginii este definită de clasele CSS de elemente HTML. Aceste clase conțin, de asemenea, informații despre aspectul final al ecranului creat de documentul HTML. Utilizați HTML pentru conținut - CSS pentru prezentare vizuală. Documentul vizualizat este codificat în format HTML, iar structurile noi care trebuie definite sunt limitate la stilul determinat de CSS și ID-uri. În plus, documentul final va fi construit aplicându-l prezentării acestor clase în structura HTML.

Creați și ajustați imaginea de fundal ca parte din fila BODY pentru orice pagină definită de fișier.css. În partea de sus a documentului dvs. CSS (în fișierul deschis), puteți încerca să adăugați un cod similar celui din următoarele mostre de cod.

CAVEAT, Excepție: Desigur, această imagine ar putea fi ignorată efectiv în HTML dacă foaia de stil stabilește fundalul pe cont propriu. Alegerea dvs. ar putea fi negată pe un fundal aparent gol și suprapusă de o imagine albă sau neagră definită de foaia de stil, sau foaia ar putea lăsa ea nedefinită pentru a vă permite să efectuați ajustări similare cu cele prezentate în exemple.
BODY {text-align: center-background: url (img / rome_da_imagem.jpg) center-} / * așeza un comentariu aici cu un asterisc * /
- Dacă aveți o imagine mare care să acopere întreaga pagină, adăugați "fără repetare"în exemplul anterior, la scurt timp după"centru"În caz contrar, fundalul ar fi umplut cu imagini plasate unul lângă altul, ca și cum ar fi un fel de textură de umplere.

Rețineți că acest pas poate fi făcut în mai multe moduri. Iată câteva exemple:

BODY (fundal: url (banner.jpg) 50% 0%}
BODY (fundal-imagine: url (banner.jpeg) - background-position: top center-}
BODY (fundal: url (banner.jpeg) sus)
BODY (fundal: url (banner.jpeg) 0% 0%}
P {fundal: URL (xadrez.jpg) gri 50% repeat fix}

Introduceți adresa în locația indicată împreună cu numele imaginii.

Vizualizați documentul. După introducerea unuia dintre tipurile de coduri de mai sus, salvați documentul și deschideți pagina pentru a vedea rezultatul!

Tipuri de stiluri

1
Aflați cum să utilizați toate cele trei tipuri de stiluri, evitând metodele redundante și împrăștiate - centralizați codurile.

Evitați "stilurile inline"care sunt scrise direct pe mai multe etichete dintr-un document. inline afectează doar etichetele în care sunt aplicate, cum ar fi: Evitați stilurile încorporate sau "stiluri încorporate"în antetul fiecărui document.Noteșteți-vă că stilurile încorporate sunt redundante, deoarece sunt scrise în mod repetat și afectează numai etichetele din pagina în care au fost plasate. De exemplu: Legătura cu "stilurile externe" care sunt scrise într-un document separat și conectate la diverse documente web, pentru a avea mai puține coduri pe paginile individuale. Foile de stil externe pot afecta orice document la care sunt conectate în aplicația de stiluri, cum ar fi:

Obțineți descărcări mai rapide ale paginii ca un beneficiu colateral al utilizării celor mai bune practici de CSS, pe care le recomandăm mai întâi să standardizeze titlurile de prezentare și de text (bannere, coloane, fonturi, dimensiuni și stiluri) și imagini (dimensiune, margini, colțuri rotunjite, etc.) în foi de stil externe pentru a afișa paginile conectate la un site Web.

Utilizați foi de stil cascadă pentru a le aplica pe orice pagină conectată la foaia de cod CSS (sau document) în cauză. Puteți, desigur, să aveți mai multe foi de stil pentru diferite tipuri de pagini (principale, galerii, articole, liste etc.), dar acestea pot fi combinate dacă stilurile și ID-urile sunt consecvente, limitate și solicitate atunci când este necesar.

sfaturi

Atașați sau "Încorporați„- în tehnologia digitală - înseamnă ceva loc (text, imagine, sunet, video sau cod activ) într-un fișier de calculator, document HTML, software sau dispozitiv electronic: atașați imagini în web- lor atașa software-ul în mașini și avioane pentru operarea monitorizarea motorului sau monitorizarea navigației etc.
Este posibil ca stilul paginii să fie modificat pentru a se potrivi cu fundalul.
"Suprapunerile DIV au devenit cea mai populară modalitate de a înfrumuseța profilele MySpace fără cunoștințe HTML foarte bune. Găsirea unui DIV prefabricat depinde în primul rând de unde doriți să utilizați codul. De exemplu, o suprapunere DIV necesită de obicei să "ascundeți" codul comun pentru afișarea unei anumite pagini. Deci, dacă utilizați MySpace, trebuie să se asigure că codurile includ codul aplicabil MySpace - același lucru este valabil pentru alte bloguri sau pagini sociale. Există mai multe site-uri care oferă coduri DIV, iar unele dintre ele pot servi drept ghid prin crearea propriului său proces, și chiar mai mult, care vă va oferi simplitatea de punct și faceți clic. Nu aveți nevoie de cunoștințe aprofundate de HTML, dar este important ca tu cel puțin să înțeleagă elementele de bază în funcționarea acestuia atunci când este utilizat împreună cu CSS, ca limba CSS este modul în care sunt create suprapuneri de DIV. "