Stiluri în html

Există o altă recepție elemente de poziționare și de a obține efecte externe, care pot înfrumuseța pagina și o aduce în atenția cititorilor. Această tehnică se bazează pe definirea de stiluri personalizate și foi de stil care specifică. Stylesheet - este doar o descriere a structurii unor proprietăți ale unui element. Nu te uita aici pentru orice grilă dreptunghiulară. Dacă este specificat foaia de stil, diferitele documente se pot referi doar la masă și nu conțin un număr mare de atribute în tipul de etichete de formatare <Н1>, și m. p.

Cascading Style Sheets (CSS, Cascading Style Sheets) conțin o descriere a formatului unora sau a tuturor textului, coordonatele amplasarea elementelor, și alți parametri. Stilul țintă este asigurată de ambele tag-ul utilizate în cadrul tag-uri antet fișier și . și atributul STYLE - în secțiunea tag-ul din titlu (<Н1>, <Н2>.

), Precum și în tag-ul . tagul selectarea fragmentului
si multe altele.

tag-ul de aplicare


<Н1>Acest stil HI. Culoare - Rosu
<Н2>Acest stil de H2, la fel ca și HI. Culoare - Rosu
Acest lucru - stilul implicit obișnuit

Putem crea o foaie de stil, asigurând numele ei. Acest nume este dat ca un nume comun, dar cu punct ca primul caracter. Apoi, putem aplica etichete la masa dupa numele acestuia, folosind atributul = SLASS imya_stilya. în cazul în care numele stilului folosit fără punct.
De exemplu, puteți seta stilul de genul:

O poziție de stil al doilea nivel poate fi setat oriunde în program, după cum urmează:

Luați în considerare următorul exemplu creează un efect care, fără a stabili stilul ar fi realizabile doar prin intermediul graficelor. Am pus un text pe unul de altul. Această funcție va continua să fie folosite pentru a crea efectul surround al textului (așa-numitul ZD-efect). În plus, capacitatea de a suprapune fragment de pagină (parțial capac) este adesea folosit în proiectarea efectivă a paginii. de exemplu, se aplică Vdannom etichetă

pentru selectarea fragmentului HTML-document. Observați cum în definiția stilului tag-ul BODY definește diferitele stiluri cu nume de umbră, fundație, strat 1 și stratul 2. Aceasta este ceea ce se înțelege prin foile de stil în cascadă.



exemplu CSS
BODY
.Shadow font-size: 27Opx; 1ine-height: 270px;
font-family: Times)
.bază (culoare: roșu; greutate: 900; margin-top: -230px; font-size: 220px;
line-height: 250px; font-family: Times)
. Layer1 (culoare: negru; margin-top:

130 x; greutate: mediu; ont-size: 65px;
line-height: 65px; font-family: Arial>
.Layer2 line-height: 45px; font-family: Arial>



Stilul cascadă EXEMPLU





Noi / DIV>
Noi / DIV>
Am făcut-o fără nici o grafică

folosind numai stiluri de text



Fig. Stilul cascadă 665. EXEMPLU

În exemplul utilizat tag

și atributul CLASS. etichetă
Este folosit pentru a specifica (fragment de document) pagina. El nu a format, ci marchează doar o bucată de text care este tratată ca o singură entitate. Atributul class vă permite să facă referire la foaia de stil, și, astfel, a stabilit stilul de prezentare a textului, care se află între etichetele
și . Notă modul în care foaia de stil definit de stilul: setați proprietățile acolade este dat un nume, precedat de un punct. În viitor, există link-uri către aceste nume folosind atributul CLASS la utilizarea unui stil definit anterior. Ideea este simplă: în primul rând determinat ceva, și apoi utilizați această definiție prin referință.

În acest exemplu, textele sunt definite ca în straturi suprapuse unul pe celălalt. Astfel, umbra este afișat primul strat, atunci acesta este suprapus pe bază de strat, apoi - stratul 1 și stratul 2. Ordinea în care straturile sunt suprapuse pe fiecare parte, având ordinea tag-ul fragmentelor de text marcate

. De fapt, se suprapun straturi este asigurată prin aplicarea valorilor negative ale proprietăților marjei-top (marginea de sus).

In exemplul de mai sus, au fost utilizate următoarele proprietăți:

  • margin-top - marginea de sus;
  • culoare de culoare;
  • font-size - dimensiunea fontului;
  • font-family - font-family;
  • greutate - gradul de font „grăsime“;
  • line-height - înălțimea rândului.

Folosind valori negative ale proprietăților marjei-top. puteți aplica un text la altul.
În plus față de căile menționate mai sus scris stiluri, puteți aplica atributul STYLE. introdus în etichetele de titlu, alineatele <Р>. corpul .

și . În acest caz, stilul este definit în următorul format:

proprietăți Descriere Stil ghilimele și conține proprietățile și valorile lor sunt enumerate separate prin punct și virgulă, așa cum sa făcut la utilizarea etichetei