Синтаксис CSS

1. Для CSS:
Селектор {имя_параметра1: значение; имя_параметра2: значение; . . . имя_параметраN: значение}

2. Для атрибута style:
style="имя_параметра1: значение; имя_параметра2: значение; . . . имя_параметраN: значение"

В качестве селектора используется:
1) либо имя тэга (без уголков),
2) либо значение его атрибута id, перед которым указывается символ #.

Пример 1:
<style>
     h1 {color: red; font-size: 24pt}
</style>

Пример 2:
для заголовка: <h1 id=myh1>ПРИВЕТ!<h1>
<style>
     #myh1 {color: red; font-size: 24pt}
</style>

Пример 3:
для нескольких элементов (тэгов) с одинаковыми параметрами селектор можно сгрупировать.
В этом случае тэги разделяются запятой.
<style>     h5, p, b {color: green; font-style: italic;} </style> <h5>Эта запись - результат Примера 3</h5> <b>Эта запись - результат Примера 3</b> <p>Эта запись - результат Примера 3</p>

Эта запись - результат Примера 3
Эта запись - результат Примера 3
Эта запись - результат Примера 3

Для одного и того же тэга можно задать разные стили, называемые КЛАССЫ
Имя класса можно использовать в тэге как значение атрибута class.

Пример 4:
<style>
h1.курсив {font-style: italic}
h1.подчеркнутый {text-decoration: underline}
</style>

<h1>Обычный заголовок</h1>
<h1 class=курсив>Заголовок курсивом</h1>
<h1 class=подчеркнутый>Заголовок подчеркнутый</h1>

Для создания стиля элемента вложенного в другой тэг используют контекстный селектор
Контекстный селектор состоит из имени тэга-контейнера и имени вложенного в него тэга, разделенных пробелом.

Пример 5:
p b {color: green; font-style: italic;}
<p>Эта запись - результат <b>Примера 3</b></p>

(Сравни с Прмером 3)
Здесь жирный текст будет отражаться зеленым курсивом, если только он применяется внутри абзаца.
Во всех остальных случаях содержимое тэга <b> будет просто жирным.

Эта запись - результат Примера 5

вверх