Селектор типа в CSS используется для выбора и стилизации HTML-элементов на основе их имен тегов. Он обозначается только именем тега, без предшествующих ему селекторов класса или идентификатора. Вот несколько методов и примеров использования селектора типа в CSS:
-
Селектор базового типа:
p { color: blue; }
При этом будут выбраны все элементы
и установлен синий цвет их текста.
-
Выбор типа потомка:
div p { font-weight: bold; }
При этом выбираются все элементы
, которые являются потомками элемента
, и выделяется их текст жирным шрифтом.Выбор дочернего типа:
ul > li { list-style-type: square; }
При этом выбираются все элементы
- , которые являются прямыми дочерними элементами элемента
Селектор соседнего одноуровневого типа:
h1 + p { margin-top: 20px; }
При этом выбирается элемент
, который следует сразу за элементом
, и добавляется верхнее поле в 20 пикселей.
Выбор типа атрибута:
input[type="text"] { border: 1px solid #ccc; }
При этом выбираются все элементы
с атрибутом
type="text"
и применяется сплошная граница толщиной 1 пиксель.Выбор типа псевдоэлемента:
p::first-line { font-weight: bold; }
При этом будет выделена первая строка всех элементов
и выделен текст жирным шрифтом.