Стиль CSS
- состоит из селектора и объявлений. Селектор указывает к какому элементу или группе элементов применяется данный стиль. Объявления состоят из свойств и значений изменяющих вид элемента.
Селекторы могут представлять из себя элементы html:
p{color:green}
Задает зеленый цвет для текста внутри элемента p, color - свойство, green - значение.
Так же селекторами могут быть имена классов или идентификаторов элемента:
.classGreen, #idGreen{color:green}
<p class='classGreen'>текст 1</p>
<p id='idGreen'>текст 2</p>
Стиль может задается нескольким селекторам которые следует указать через запятую. Селектор указывающий на элемент по имени класса, должен начинаться с точки .classGreen.
Селектор указывающий на элемент по имени идентификатора, начинается с символа решетки #idGreen.
Селекторы класса и идентификатора более приоритетны, чем селекторы с именами элементов.
Селекторы атрибутов
Могут использоваться с элементами в которых они содержатся:
a[href]{text-decoration:none}
С уточнением содержимого атрибута:
a[href="#"]{text-decoration:none}
Только с использованием атрибута:
[href='#']{text-decoration:none}
[value='1']{color:green}
Cтиль будет добавлен, к элементу, если ему предшествует подобный элемент.
div + div
Стиль будет добавлен к элементам, кроме элемента указанного в скобках:
input:not(#idGreen){background-color: black; color: white; border:none}
В данном случае будет добавлен стиль ко всем элементам типа input, кроме элемента input с селектором #idGreen.