Сначала поговорим о правописании стилей. Мы можем задать стиль для каждого тега. В предыдущем примере мы задали стили для тега BODY, H2 и для тега P, перепишем их для наглядности:

В этом случае каждая строчка является правилом. То есть у нас три правила.

Теги BODY, H2 и P в этом случае являются селекторами, а то, что заключено в фигурные скобки - называется определением.

Каждое определение состоит из свойства (background-color, color и т.д.) и значения (papaywhip, maroon, red).

Вообще, значения свойств может быть описано и в цифровом эквиваленте. Так что вполне уместно было бы написать и так:

Но и это не все! Обратите внимание на последнюю строчку все три пары одинаковых цифр (чисел). Если вы стремитесь экономить каждый байт (и это похвально!), можете написать и так:

То есть парные знаки мы заменили одним! Если учесть, что каждый знак "весит" один байт, то только на этом простеньком примере мы сэкономили 3 байта. А представьте, сколько получится экономии при больших документах! Так что просто примите во внимание это совет, и лучше, если вы научитесь сразу экономить каждый байт. Ведь недаром говорится - "копейка рубль бережет". Так что будем бережливы.

Далее, мы можем дать не одно, а несколько определений в одном правиле! Например, для селектора H2 мы можем дать не только красный цвет, но и расположение этого заголовка по центру. А для селектора P дадим сразу три определения: цвет:марон, наклонный шрифт и выравнивание по правому краю! Вот мы и откроем наш документ mystyle.css и внесем изменения:

Обратите внимание, что одно определение отделяется от другого точкой с запятой (;), а после последнего определения точка с запятой не ставится! Впрочем, если точку с запятой все-таки поставить в конце, ничего страшного не случится. Все равно правило сработает. Некоторые дизайнеры даже советуют и в конце ставить, хотя бы из-за того, что иногда приходится добавлять следующее свойство, и можно не обратить внимание, что перед новым свойством нет этой точки с запятой, а потом долго удивляться "несрабатыванию" всего правила.

Кроме того, совершенно безразлично, какими буквами вы пишете селекторы - прописными или строчными. Так что можете писать как P, TABLE, H2, так и p, table, h2. Я вот постараюсь писать прописными. Ну, и сохраним наши изменения и посмотрим, что получится в нашем файле nerv_people.html, который мы не трогали!

Как видите, правило сработало! С чем себя и вас поздравляю. Однако запись во внешнем файле - не единственная возможность добавления стилей CSS в документ. Можно его ввести даже в самом этом документе при помощи слов STYLE=... и вместо точек записывать нужное правило. Создадим новый файл nerv_people-2.html

Листинг 3. Файл nerv_people-2.html

Видите? После нужного тега мы пишем STYLE=..., и затем в кавычках даем свойство и затем, после двоеточия - значение этого свойства. В этом случае не нужно никакого внешнего файла! Откроем этот файл в браузере и увидим:

Как и заказывали, фон BODY у нас получился светло-серым, заголовок H2 - красным и выровненным по центру, нечетные абзацы - коричневым цветом, с наклоном, и выровнены по правому краю, ну а четные – синие и выровнены по левому краю окна браузера.

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

Но есть и еще один метод включения CSS в документ - так называемый встроенный стиль. Этот стиль записывается в заголовке страницы и он воздействует на всю страницу! Что мы сейчас и продемонстрируем:

Листинг 4.

Как видите, весь стиль описывается между тегками [/i] и [i]. Он начинается со строчки , и заканчивается . А внутри записываются все правила. Что ж проверим, как все это у нас сработало:

Что ж, на сегодня хватит. Я дала вам лишь основные понятия, что такое вообще стили CSS. Но я не рассказала обо всех богатствах этого раздела. Я не рассказала как можно с помощью CSS изменять шрифт, текст, делать разные отступы и рамки, скрывать и вновь объявлять слои, как точно позиционировать элементы на экране, как менять маркеры и указатели мыши... Вы еще не знаете всего этого... Но скоро это будет. И ваши странички преобразятся, и вы сами почувствуете РАЗНИЦУ. Как из гадкого утенка в конце-концов вырастает лебедь, так и ваши пока не оперившиеся сайты будут набираться силы и профессионализма. Потому что я так сказала. Ваш Дикий, но Добрый и любящий вас Учитель. И пусть не все так гладко, пусть не все получается как надо, пусть многое еще непонятно, но ваше усердие и упрямство - залог ваших будущих успехов. Ведь ВСЕ, в конечном счете, все зависит от вас и только от вас.