Написание правил CSS

Базовую структуру селектора и объявления можно расширить тремя способами. Правило может содержать несколько объявлений.

p {color:red; font-size:12px; line-height:15px;}

Это правило задает красный цвет для шрифта текста абзаца, размер шрифта 12 пунктов и высоту строки в 15 пунктов.

Обратите внимание, что каждое объявление заканчивается точкой с запятой, которая разделяет их между собой. Последняя точка с запятой перед закрывающейся скобкой является необязательной, но в дальнейшем это позволяет добавлять объявления в правило, не вспоминая о том, что перед ними необходимо поставить точку с запятой.

Можно сгруппировать несколько селекторов.

Допустим, если вы хотите выделить шрифт заголовков с 1 по 6 уровень жирным и синим, то можете сделать это с помощью следующего правила:

h1 {color:blue; font-weiqhl:bold;}
h2 {color:blue; font-weight:bold;}
h3 {color:blue; font-weight:bold;}
h4 {color:blue; font-weight:bold;}
h5 {color:blue, font-weight:bold;}
h6 {color:blue; font-weight:bold;}

Либо можно просто сгруппировать селекторы в одном правиле, указав их через запятую:

h1, h2, h3, h4, h5, h5 {color:blue; font-weight:bold;}

Так гораздо легче. Просто не забудьте добавить запятую после каждого селектора за исключением последнего. Пробелы ставить необязательно, но они помогают сделать код более удобным для чтения.

К одному селектору можно применить несколько правил.

Если, написав предыдущее правило, вы решили, что хотите сделать заголовок h3 выделенным курсивом, можно просто добавить:

h1, h2, h3, h4, h5, h6 {color:blue; font-weight:bold;}
h3 {font-style:italic;}