Tablele Zebra
2 participanți
CsAng3L :: Programing & Coding :: CSS
Pagina 1 din 1
Tablele Zebra
Hai sa ne uitam putin la urmatoarea imagine:
Orcine
a folosit vreodata iTunes, va recunoaste imediat originea imaginii.
Dungile care alterneaza intre alb si albastru au dublu rol: In primul
rand arata mai bine din punct de vedere estetic si in al doi-lea rand
ghideaza ochiul privitorului, permitandu-i acestuia observe mai bine
detaliile unui rand.
Daca aveti impresia ca al doilea motiv nu este chiar asa de intemeiat observati diferentele in aceste imagini.
In
eventualitatea in care utilizezi o asezare dinamica (liquid layout) in
pagina unui site, poti ajunge in situatia arata in comparatia de mai
sus. Coloanele sunt separate de mult spatiu alb (gol), facand dificila
trecerea de la o coloana la alta pe acelasi rand.
Obtinerea
efectului de linii colorate diferit in XHTML este destul de usor: se
alterneaza culorile fundalului pentru liniile pare si impare. Una alba,
una albastra, etc ..
Acest lucru poate fi facut cu doua clase CSS
(una pentru dungile pare si alta pentru dungile impare) care se aloca
cate una pentru fiecare rand, alternativ. Un exemplu simplu arata asa:
Orcine
a folosit vreodata iTunes, va recunoaste imediat originea imaginii.
Dungile care alterneaza intre alb si albastru au dublu rol: In primul
rand arata mai bine din punct de vedere estetic si in al doi-lea rand
ghideaza ochiul privitorului, permitandu-i acestuia observe mai bine
detaliile unui rand.
Daca aveti impresia ca al doilea motiv nu este chiar asa de intemeiat observati diferentele in aceste imagini.
In
eventualitatea in care utilizezi o asezare dinamica (liquid layout) in
pagina unui site, poti ajunge in situatia arata in comparatia de mai
sus. Coloanele sunt separate de mult spatiu alb (gol), facand dificila
trecerea de la o coloana la alta pe acelasi rand.
Obtinerea
efectului de linii colorate diferit in XHTML este destul de usor: se
alterneaza culorile fundalului pentru liniile pare si impare. Una alba,
una albastra, etc ..
Acest lucru poate fi facut cu doua clase CSS
(una pentru dungile pare si alta pentru dungile impare) care se aloca
cate una pentru fiecare rand, alternativ. Un exemplu simplu arata asa:
Cod: |
<8212> <8212> <8212> <8212> <8212> <8212> |
CsAng3L :: Programing & Coding :: CSS
Pagina 1 din 1
Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum