CSS - средство для создания лучших сайтов

Леха ББ aka Alexys

Спецвыпуск Xakep, номер #027, стр. 027-032-2

Если бы можно посредством CSS'а менять стиль одного тэга только один раз, то CSS умер бы в зародыше. Главное, что можно делать - это самому вводить классы и описывать их свойства. Самое трудное - это выбрать, как обозвать классы. Рекомендую обзывать их так, чтобы ты сам понимал, какой для заголовков, какой для текста и т.п. От вышеописанного примера отличается наличием точки перед названием класса:

.hdr1 {font-style: Arial; font-size: 16px; font-weight: bold; text-align: center;}

После описания класса надо бы его использовать в своих целях. Для вызова класса нужно указать его имя:

<div class="hdr1">Вот такой заголовок</div>

Броузер выдаст жирный текст шрифтом Arial, размером 16 пикселей и выровненный по центру. Для повторного использования на странице класса просто напиши опять <div class="hdr1">еще какой-то текст</div>. Старайся как можно реже использовать тэг <font></font>, а лучше вообще забыть про него. Юзай вместо него <div></div> - с CSS он намного лучше дружит, да и обрабатывается пошустрее.

б) Связанные таблицы

Если на твоем сайте есть (или будет) хотя бы 20-30 страниц, а CGI и SSI не дает юзать хостер, то тут только связанные таблицы облегчат твое бедовое положение. Вдруг тебе захочется немного поменять внешний вид сайта. Править даже 20 страниц будет очень утомительно (знакомо по своему первому опыту еще года 4 назад, когда я захотел поменять цвет заголовков на сайте). Используются связанные таблицы почти так же, как и внутренние, только описание всех классов заносится в отдельный файл some_name.css, а на странице указывается путь к нему:

<link rel="stylesheet" href="some_name.css">

Синтаксис файла в точности такой же, как и при использовании глобальных таблиц - начинается с <!-- и заканчивается -->, а между ними идет описание всех придуманных тобой классов. Причем не будет каждый раз грузиться css-ник, ибо он после загрузки первой страницы сайта закэшируется броузером и дальше будет таскаться из кэша (правда, если кэш не отключен заранее заботливыми ручками).

в) Внутренние таблицы

Внутренние таблицы вставляются в html-странице в месте непосредственного их применения. Как правило, такой стиль используется 1-2 раза на странице, и не хочется наваливать в CSS-ник еще один стиль. Для использования внутренних таблиц ничего специального описывать не нужно. Единственное, что нужно, - это записать стиль для нужного тэга в том месте, куда ты его решил засунуть:

<div style="font-family: Verdana; font-size: 12px; color: #000066;">попробуем внутренние таблицы</div>

Еще один резон использовать внутренние таблицы есть в том случае, если нужный в каком-то месте стиль отличается немного от уже описанного. Например, описано у тебя выравнивание по центру для класса "hdr2" (.hdr2 {font-family: Verdana; font-size: 16px; font-weight: bold; color: red; text-align: center;}), а тебе надо то же самое, но сдвинутое влево. Тогда нужно только во внутренней таблице указать новое выравнивание: