First-child in Last-child so precej neznane CSS značke, ki so zelo uporabne za oblikovanje besedil in navigaciji spletnih strani. V praksi lahko npr. prvemu odstavku v besedilu enostavno določimo still brez določanja posebnih klasov (class) ali poseganja v HTML del. Prav tako lahko v navigaciji, ki so zgrajene s pomočjo seznamov (buletov) določimo poseben stil prvemu in zadnjemu vnosu – npr. drugačen zaključek, … možnosti je skratka ogromno.
Spodaj je podan primer, kjer prvi odstavek označimo z krepkim besedilom (bold) in pisavo v zadnjem odstavku obarvamo v sivo.
Koda:
p:first-child { font-weight:bold; }
p:last-child { color:#666666; }
Pri last-childu zna imeti Internet Explorer (IE) težave. Zaradi slednjega je pametno uporabljati Javascript knjižnico, ki odpravi pomanjkljivosti IE-ja. O tej temi smo govorili v članku IE7 – Javascript knjižnica, ki odpravi večino napak Internet Explorerja.