Группировка селекторов
В таблицах стилей часто встречаются элементы с одинаковым стилем.
Чтобы свести к минимуму код, вы можете группировать селекторы.
Отделяйте каждый селектор запятой.
В приведенном ниже примере мы сгруппировали селекторы из кода выше:
Пример 1
Вложенные селекторы
Можно применить стиль для селектора внутри другого селектора.
В приведенном ниже примере один стиль указан для всех элементов p, и отдельный стиль указанн для элементов p вложенных в класс "marked":
Пример 2
<html>
<head>
<meta charset=utf-8" >
<style type="text/css">
p {
color:blue;
text-align:center;
}
.marked { background-color:blue; }
.marked p { color:white; }
</style>
</head>
<body>
<p>Это синий, отцентрованный параграф.</p>
<div class="marked"><p>Этот элемент p не должен быть синим.</p></div>
<p>Элементы p внутри элемента с классом "marked" сохраняет стиль выравнивания, но имеет другой цвет шрифта.</p>
</body>
</html>
Была ли эта информация полезной?
