CSSда селекторларни гуруҳлаш

Баъзан бундай вазият юз бериши мумкин: сиз турли теглар билан бир хил иш қилишингиз керак, масалан, барча сарлавҳаларни h2, h3 ва абзацларни қизил рангга бояш. Бундай ҳолда сиз шунга ўхшаш нарса ёзишингиз керак:

h2 {
	color: red;
}
h3 {
	color: red;
}
p {
	color: red;
}

Аммо, буни бир оз қисқароқ қилишнинг усули мавжуд: тег селекторларини вергул орқали бирлаштириш мумкин ва CSS коди уларнинг ҳаммасига бир вақтнинг ўзида қўлланилади. Юқорида келтирилган кодни қисқароқ қилиб шундай ёзиш мумкин:

h2, h3, p {
	color: red;
}

Селекторларни гуруҳлашдан фойдаланиб, кодни соддалаштиринг:

h1 {
	text-align: center;
}
h2 {
	text-align: center;
}
h3 {
	text-align: center;
}