Crearea unui bloc în CSS, am întotdeauna clar definit parametrii săi, precum și poziționarea într-o anumită locație de pe ecran. Astfel, orice unitate are două coordonate X și Y, care definesc poziția blocului pe planul ecranului. Dar CSS există un al treilea, coordonarea spațială Z, care determină numărul stratului pe care se află unitatea. Ie Cu cât este mai mare coordonata Z, cu atât este mai mare acest strat față de ceilalți. De exemplu, stratul cu numărul 2 va fi mai aproape de utilizatorul care vizualizează pagina dvs. decât stratul cu numărul 1. Și stratul cu numărul 1 va fi situat mai sus decât codul paginii principale.
Crearea unui strat în CSS corespunde proprietății indexului Z. iar valorile pe care le ia indică numărul stratului.
De exemplu, puteți face o combinație faimoasă de cărți Royal Flash.
După cum puteți vedea, fiecare carte se suprapune pe cealaltă. Iată cum arată codul:
.poziția desatka_buba: absolută;
stânga: 200px;
top: 200px;
z-index: 1;
>
.valet_buba Poziție: absolută;
stânga: 215px;
top: 215px;
z-index: 2;
>
.dama_buba poziție: absolută;
stânga: 230px;
top: 230px;
z-index: 3;
>
.poziția corol_buba: absolută;
stânga: 245px;
top: 245px;
z-index: 4;
>
.Poziție tuz_bubna: absolută;
stânga: 260px;
top: 260px;
z-index: 5;
>
Ei bine, în codul html. trebuie doar să atribuiți stilurile corespunzătoare desenelor, cum ar fi:
Ei bine, și așa mai departe, înțelegi.
Dacă înțelegeți cu atenție această metodă simplă, puteți crea lucruri destul de decente. De exemplu, plasați text deasupra imaginii sau invers, creați titluri frumoase. de exemplu, cu efectul de umbră, de asemenea, dacă studiați straturile mai adânc, puteți crea meniuri drop-down. și multe altele.
Articole similare
-
Sărituri în CS - sărituri - catalog de articole - site personal
-
Ghidul minier - profesia de wow lume - catalog de articole - site-ul personal
Trimiteți-le prietenilor: