Разберемся со всякими полезными мелочами, без которых создание правильных таблиц стилей невозможно. Начнем с цветов. Их в CSS обычно задают двумя способами: с помощью ключевых слов и цветовой схемы RGB. Я предпочитаю второй способ, потому что он компактнее и в таблице стилей лучше видно, где задаются цвета. В схеме RGB цвета описываются степенью насыщенности красного, зеленого и синего компонентов. Насыщенность компонентов указывается числами в шестнадцатеричном формате. Например, белый цвет обозначается #ffffff (максимальная насыщенность всех компонентов), черный — #000000 (минимальная насыщенность компонентов), красный — #ff0000, серый — #666666.
В предыдущих главах вы не раз сталкивались с подобной записью цветов, так что все должно быть уже достаточно привычно. Кроме того, вы встречали и сокращенную запись цветов. Например, #fff — это аналог #ffffff, а #666 — аналог #666666. В такой форме записи вместо шести символов используется всего три и при этом подразумевается, что каждый компонент содержит два одинаковых символа. Сокращенная форма записи мне нравится больше, и я всегда ей пользуюсь, если возможно. Приведем примеры:
A {color:  #CA1D1D; background:  #FFFE9E} P {color: #666}
Перейдем к URL (Universal Resource Locator — универсальный указатель ресурса). Собственно, разговор о них будет очень коротким. В каскадных таблицах стилей пути обычно используются для задания фонового изображения. Делается это следующим образом:
.bgl  {background: url(i/bgl.gif)}
Существует специальная функция url, внутри которой задается путь к файлу. Если нужно сделать фоновое изображение, то я обычно создаю класс bgx, где х — какая-нибудь цифра. Файлы с фоном я называю точно так же, как класс. В приведенном примере класс — bgl, а файл — bgl.gif. Это позволяет очень быстро создавать новые стили для фоновых изображений: следует просто сделать новый файл, скопировать уже имеющийся стиль и заменить цифру 1 на 2.
Закончим параграф разговором о единицах измерения. В CSS довольно много единиц измерения, но на практике используются следующие:
• рх. Один пиксель равен одной точке на экране монитора. Обычно мониторы имеют разрешение 800 х 600 или 1024 х 768 пикселей. С пикселями вам приходилось иметь дело в HTML.
• em. Один em равен размеру (высоте) шрифта данного элемента. Например, запись tcomment {font:  12рх Verdana; padding: 2em}
означает, что для блока comment отступы будут составлять 24 пикселя.
• %. Проценты вычисляются относительно базового элемента и зависят от контекста. Например, если ширина таблицы 400 пикселей, а ее ячейки — 50 %, то фактическая ширина ячейки будет 200 пикселей. С процентами вы тоже довольно часто сталкивались в HTML.
Как видите, чаще всего придется иметь дело с привычными пикселями и процентами. На примере рассмотрим Блогун При «резиновом» дизайне можно попробовать использовать em, но с ним есть определенные проблемы. Дело в том, что бывает сложно подобрать правильные значения единиц, заданных в em, чтобы в разных браузерах все выглядело нормально. При изменении размера шрифта в браузере все размеры, заданные в em, также изменяются. Но хотя пропорции и сохраняются, все же вид сайта может преобразиться очень сильно.
Итак, где обычно применяются те или иные единицы измерения? Начнем с пикселей. Обычно с их помощью задают геометрические размеры фиксированных блоков:
#status  {width: 200рх; height: 70рх}
Также в пикселях часто задают размер шрифта. Вообще на эту тему идет много споров, и часто рекомендуют задавать размер шрифта с помощью em. Такая практика имеет право на жизнь, но у пикселей есть свои преимущества. Во-первых, дизайн будет хорошо смотреться на любом мониторе, во-вторых, он наверняка не развалится, если пользователь изменит размер шрифта в своем браузере.
Недостатки тоже есть: пользователь не может изменить размер шрифта, заданного в пикселях, если он смотрит сайт с помощью браузера Internet Explorer. Недостаток, надо сказать, достаточно серьезный. Как сделать лучше и в каком случае, обсудим в п. 6.6.
Еще в пикселях часто указывают размер отступов и полей, а также толщину рамок:
#status  {padding: Юрх; margin: 5px; border: lpx solid #000}
Проценты чаще всего используют для задания ширины и реже — высоты блоков:
#left-div {width: 30%; float: left} Крайне редко в процентах задают отступы и поля.
Величину em применяют для указания относительного размера шрифта и изредка — для задания отступов и полей. Честно говоря, em используют редко.