Grupisanje CSS stilova možemo koristiti kada god više stilova dijeli iste postavke, na primjer, želimo da naslovi h1 i h2 te ul lista i obicni tekst budu crveni. Umjesto da pravimo tri stila i u svakom zadamo da su slova crvena, možemo napraviti jedan zajednički stil koji će se zvati h1,h2,ul,.text i zadamo tom jednom stilu crvenu boju.
Pogledajte primjer unutar CSS designera, kliknite na stil h1,h2,h3 i pogledajte text properties ispod
Ovaj tekst će biti crven i poravnat desno jer je zajedničkim stilom dobio crvenu boju, a svojom klasom .tekst je poravnat desno.
Vidimo u primjeru iznad da svi stilovi dijele postavku boje ali i da je h2 napisan drugim fontom. Kako je to urađeno? Font od h2 je definisan kao poseban stil h2 u kojem je zadan samo font. U tom stilu boju nećemo zadavati jer je taj stil boju naslijedio od stila h1,h2,ul,.tekst
Takođe vidimo da je ul lista italic, kako je to urađeno? Napravljen je poseban ul stil u kojem nismo definisali ni boju, ni font, nego samo smo rekli da su slova italic, na taj način se taj italic dodao na prijašnje definicije.
Slova su crvena jer su dobila preko zajedničkog stila boju, a posebnom klasom .tekst im je dodat italic.
Zaključak
Ako imamo potrebu da više stilova ima istu postavku možemo dakle jednostavno te CSS stilove nabrojati i svi će dijeliti tu postavku, ako nam kasnije treba da se neki stil po nečemu razlikuje, onda samo navedemo ime tog stila kao posebno i u tom stilu definišemo šta je to što je drugačije u odnosu na ostale.