Web Style Sheet
CCS savjeti i trikovi

Dokument https://www.innerviewme.com/007/evenodd.html, je prijevod i može sadržati pogreške. Originalni službeni dokument može se vidjeti na https://www.w3.org/Style/Examples/007/evenodd.html. Pogreške možete prijaviti na moj e-mail matthewjon75@yahoo.com.
Smoky Mountain Cabins For Sale Pigeon Forge Cabin For Sale Homes for Sale in New Port Richey

(This page uses CSS style sheets)

Status

Upozorenje: u vrijeme pisanja (veljača 2003.), vodeći preglednici još uvijek ne podržavaju 'nth-child' selector (uveden studena 2001.) i samo mali broj preglednika podržava COL element.

Parna I neparna pravila

Jedan od načina da se olakša čitanje tabela je bojenje naizmjeničnih redaka. Primjerice, donja tabela ima svijetlo sivi zaslon za parne redke I bijeli zaslon za neparne redke. Pravila za ovo su krajnje jednostavna:

tr:nth-child(even) {background: #CCC}
tr:nth-child(odd) {background: #FFF}
Month199419951996199719981999200020012002
Jan141314131411111111
Feb131512151512141313
Mar161514171615141515
Apr171617171715151616
May212020212220212019
Jun242325242523252324
Jul292826262726252625
Aug292827282827262826
Sep242323262424242221
Oct2022202220192022
Nov1817161716151415
Dec1513131413101311

Zapravo, CSS dopušta ne samo parna/neparna izmjenjivanja već i proizvoljne intervale. Ključne riječi "even" (parni) i "odd" (neparni) su samo prikladne prečice. Primjerice, za dugačke liste možete uraditi ovo:

li:nth-child(5n+3) {font-weight: bold}

Ovo znači da je svaki 5. podatak tabele podebljan, počevši od trećega. Drugim riječima, podaci pod brojevima 3, 8, 13, 18, 23, itd. bit će podebljani.

Parni I neparni stupci

Isto važi i za stupce tabela, ali se mora imati element koji odgovara stupcima. HTML za to pruža COL. Tabela mora početi sa jednim COL za svaki stupac:

<table>
<col><col><col><col><col><col><col><col><col><col>

<tr><th>Month<th>1994<th>1995<th>1996...

(COL se može koristiti za druge stvari osim za style, u ovom slučaju sve što nam treba je da je COL prisutno.) Naredna pravila daju prvome stupcu žuti zaslon, a zatim je svaki treći stupac sive boje počevši od trećega stupca:

col:first-child {background: #FF0}
col:nth-child(2n+3) {background: #CCC}
Month199419951996199719981999200020012002
Jan141314131411111111
Feb131512151512141313
Mar161514171615141515
Apr171617171715151616
May212020212220212019
Jun242325242523252324
Jul292826262726252625
Aug292827282827262826
Sep242323262424242221
Oct2022202220192022
Nov1817161716151415
Dec1513131413101311

Zaslon redova (TR) je nacrtan isprijed zaslona za stupce (COL), te ako želite biti sigurni da je zaslon stupaca vidljiv, onda ne se treba odrediti zaslon za redke.

CSS Valid CSS!

Bert Bos
Dokumnet sastavljen 17 siječnja 2001
Posljednja izmjena $Data: 2009/02/03 14:39:10 $GMT