Селекторы в CSS.

Какие бывают Селекторы в CSS.
Если в CSS уже назначены стили, например для параграфов <р>   задан синий цвет текста и размер шрифта 14 пикселей. Вам нужно задать одному из параграфов <р> красный цвет и размер шрифта 20 пикселей. Что же делать?

Для этого селекторы разделяют на несколько типов:

1. Селекторы CSS для элементов .
2. Селекторы CSS для для классов
3. Селекторы id
4. Селекторы CSS для контекста

1. Селекторы CSS для элементов -  нужны  для тэгов HTML к которым применяли какой либо стиль. Например заголовки и параграфы:

h1
{text-align: center;}
p
{color: blue ;font-size: 28px; text-indent: 20px; }

2. Селекторы для CSS классов - когда необходимо для одного параграфа сделать другой стиль отличающийся от всех остальных стилей. Для этого нужно создать класс в CSS. 

Пример:

>> В CSS пишем

.stepa
{font-size: 24px; color: red}

.stepa, это название нашего нового класса и в скобках стиль. «Класс», вы можете назвать как угодно, я его назвал «stepa», вы можете назвать «peta» или «sos» и не забудьте про точку перед классом «.sos»

Потом это «класс» применяем в HTML. Допустим для параграфа:

>> В HTML пишем

<p class ="stepa"> ... текст в параграфе ... </p>




Для закрепления темы ещё один пример:

>> Так выглядит код в HTML

<p>здесь работает «Селекторы CSS для элементов»</p>
<p class ="stepa">здесь новый «Селекторы CSS для для классов», текст красный</p>
<p>здесь работает «Селекторы CSS для элементов» </p>

>> Так выглядит код в CSS:

p
{font-size 32px; color: blue; }
.stepa
{font-size: 24px; color: red} 

Сначала создаём основной стиль для всех параграфов (селектор для элемента) а затем если нужно изменить какой либо атрибут создаем новый стиль (селектор для класса).

3. Селекторы id - нужны для того чтобы задать стиль для одного элемента, который будет отличаться от всех остальных.
К примеру, все стили заданы для всех элементов : для параграфов, для заголовков, для фона и т.д., но нам нужно чтобы один единственный параграф отличался цветом и размером шрифта.

>> В CSS это будет так :

p#toptext
{color: yellow; font-size: 32px; }

>> А в файле HTML укажем:

<p id="toptext"> Текст верхнего параграфа </p>

Этот тип селектора похож на предыдущий селектор для класса, разница лишь в том, что вместо атрибута "class" используется атрибут "id", а вместо точки ставиться "#".

4. Селекторы для контекста - используются для определения стиля к атрибутам текста.
Например : я хочу чтобы текст в параграфе который выделен жирным шрифтом был зелёного цвета. Для этого я должен задать параметры стиля для атрибута strong.

Пример :

p strong 
{color: green; }

Что у нас получилось? 

Пример 2 :

table p em
{color: blue; }

В втором примере получится вот что : 

дальше. - Блоки в CSS.

------------------------------------------------------------------------
22/01/2012 – Вы можете отправить WebMoney разработчикам сайта nocrisise.ru – от 0,01$ с текстом -
«спасибо за сайт nocrisise.ru »
Не забудьте в тексте указать рабочий e-m@il и Имя - вас ждёт Бонус.

Отправь от 0,01$ с текстом на WebManey: Z317847961173
------------------------------------------------------------------------