Мы уже добавляли атрибуты id или class к элементам, которые хотители стилизовать. Их еще называют id селектором и селектором классов. Но в css существует огромное количество других селекторов, которые можно использовать для стилизации одного или нескольких элементов.
Сегодня мы научимся пользоваться селектором атрибутов [attr = value]. Этот селектор позволяет найти html элементы по значению указанного аттрибута.
Например, приведенный ниже код стилизует все radio элеементы:
<style>
input[type='radio']{
margin: 20px 0px 20px 0px;
}
</style>
<form>
<label><input type="radio" name="test"> Вариант 1</label>
<label><input type="radio" name="test"> Вариант 1</label>
</form>
Еще несколько примеров:
/* стилизуем все ссылки, которые открываются в новом окне */
a[target="_blank"]{
color:red;
}
/* стилизуем все изображения, у которых есть аттрибут alt */
img[alt] {
border:1px solid black; /* Цвет текста */
}
Более подробно можно почитать тут
