3 Lecție

3 Lecția. Lucram cu fundalul site-ului.

În lecția preliminară, am învățat cum să creăm reguli într-o foaie de stil și să le legăm pe anumite etichete și elemente, oferind astfel o privire specifică acestor elemente.







Acum, fundalul site-ului nostru este alb în mod implicit. Dar pentru a oferi site-ului o individualitate, puteți seta un fundal pentru orice culoare. Cel mai simplu mod de a face acest lucru este să înlocuiți eticheta corporală în foaia de stil. Culoarea de fundal în CSS (sau orice element) este determinată de proprietatea de culoare backdround. Culoarea este setată în același mod ca în HTML, adică fie numele culorii este prescris, fie valoarea hexazecimală a acesteia se află în tabelul de culori de bază.

Deschideți foaia de stil și prescrieți această regulă:

Culoarea paginii noastre sa schimbat de la alb la albastru închis. În plus, atât culoarea de fundal, cât și culoarea paginii web s-au schimbat. Pentru a separa fundalul de culoarea paginii, să alocăm aceeași culoare albă paginii noastre web. Deoarece pagina se bazează pe tabele (design de tabel). înregistrați în foaia de stil încă o regulă de afișare a fundalului în interiorul tabelelor, și anume:

Acum avem culoarea de fundal albastru închis, iar culoarea din interiorul paginii este albă.

Amintiți-vă. că proprietatea backdround-color: este responsabil pentru culoarea de fundal a elementului. După cum ați observat deja, această proprietate poate fi aplicată oricăror elemente. De exemplu, puteți seta culoarea de fundal la orice paragraf sau o singură celulă din tabel. Și cum înțelegeți culoarea, puteți întreba și pe oricine doriți.

Firește, puteți seta aceeași culoare ca fundalul și pagina web în sine. în acest caz totul se va îmbina și va arăta o pagină monolit - acesta este gustul tău de design.

Următoarea proprietate importantă și interesantă folosită pentru a crea un fundal pe paginile web este imaginea de fundal-image: url (bg.jpg). Această proprietate vă permite să aplicați un fișier grafic ca fundal. Aici trebuie să specificăm adresa URL. calea în care se află acest fișier grafic, care va fi folosit ca fundal și, desigur, numele fișierului însuși. În acest caz, fișierul bg.jpg este într-un dosar partajat, deci nu este necesar să specificați o cale. Complet această regulă arată astfel:







Uită-te la ce avem. Cu ajutorul fișierelor grafice, puteți adăuga efecte foarte frumoase pe fundalul paginii web.

Ce este un fișier de fundal bg.jpg. Aceasta este o dimensiune tipică a fișierului grafic (în acest caz) de 50x50 px (de obicei nu mai mult de 100x100 px) care arată structura pielii. Acest fișier este plasat automat în mod implicit în CSS în colțul din stânga sus al paginii Web și, de asemenea, se propagă automat. orizontal: de la stânga la dreapta și verticală: de sus în jos. Deși puteți seta alți parametri pentru reproducere. Reproducerea acestui fișier umple tot spațiul liber.

Ca imagine de fundal, puteți aplica orice fișiere grafice (imagini, fotografii etc.). Pe Internet, puteți găsi o mare varietate de colecții de imagini de fundal diferite. Oarecum mai târziu vom învăța cum să facem astfel de imagini de fond pe noi înșine.

De exemplu, prefer cea de-a doua versiune a imaginii noastre de fundal, iar în viitor vom lucra cu această opțiune.

Și acum lista fișierului style.css din foaia de stil CSS are următorul cod:

Bună ziua, proprietatea "culoarea de fundal" din versiunea dvs. de notepad ++ este înlocuită cu "fundal" - a durat 2 ore: (Și, în general, site-ul normelor!

Vă mulțumim pentru lecțiile dvs., foarte cogniționale. Dar am o întrebare. Totul sa dovedit ca înainte (în lecțiile anterioare), dar acest lucru a început cu probleme. Am incercat sa-mi dau seama de mine, dar nimic, atunci este usor sa imi inserati lista dvs. 3.4 in fisierul dvs., dar este chiar. Fundalul nu se schimbă și nu se schimbă. În ce poate exista un motiv?

Vă mulțumesc foarte mult pentru lecție! Și cum să facem în continuare fundalul, astfel încât numai pagina să se rotească?

Lecții HTML

CSS lecții

Articole

instrumente

Șabloane de site web

cărți

ornamentare

Site web de la A la Z

Câștigați bani online

Înșelăciune pe Internet

Protecția muncii

MARIURI MODULARE

PHP LECTII

Serviciile

script-uri

SEO

jQuery

Evaluarea specială a condițiilor de muncă (SOT) - AWP

Sisteme de plăți pe internet

ÎNVĂȚĂMÂNTUL FOTOSHOPULUI

Secțiunea secretă

3 Lecție

Cu noi facem un site web
chiar și un copil poate!
"Website de la A la Z"
Aflați mai multe >>>

Vrei să câștigi bani?
2 Urovnevaja
Program de afiliere!
Alăturați-vă acum.

Imagine modulară: luxul roșu de catifea

Modular Abstraction: Energia soarelui

Imagine modulară: Trandafiri albi

Imagine modulară: Cascadă

Imagine modulară: Orhideele

Inregistrare domeniu

OOO "PC" LuxStroy "

Dacă doriți
site-ul nostru, instalați
Linkul nostru. și
Primiți cadouri.







Articole similare

Pagina anterioară

Pagina următoare

Trimiteți-le prietenilor: