Уроки CSS - введение
Перед тем как приниматься за создание сайта вам обязательно необходимо изучить уроки CSS по каскадным таблицам стилей. Уроки css достаточно просты, но очень важны. Поэтому заведите себе тетрадку в которую будете записывать основные моменты этих уроков css. Они вам пригодятся при создании сайтов.
И так что же это такое - каскадные таблицы стилей CSS, где они применяются, какие имеют преимущества - все это мы сейчас и рассмотрим.
Смысл каскадных таблиц стилей будет очень просто понять на следующем примере.
Допустим мы имеем на странице нашего сайта несколько абзацев, текст которых написан шрифтом Verdana, размером - двойка и цветом - темно-серым. Все эти атрибуты и параметры мы должны прописать в HTML-коде для всех абзацев. А если у нас на сайте много страниц с такими параметрами, то и для всех страниц.
Но в один прекрасный момент мы решили изменить дизайн сайта. А это, в свою очередь, может привести к изменению шрифта текста, его размеру и цвету.
Если же объем нашего сайта имеет более ста страниц, и на каждой странице нам необходимо будет изменить параметры абзацев, то это заберет у нас много нашего драгоценного времени.
Вот в решении этой проблемы нам и поможет таблица стилей CSS.
Смысл таблицы в том, что в ней задаются различные правила в которых прописываются параметры для тегов. Таблица стилей подключается к html-странице в области тега <head> с помощью тега link и соответственно подключаются эти правила.
Пример правила для абзацев:
p {
font-family: Verdana;
font-size: 12px;
color: #000000;
}
Это единое правило для всех тегов <p> (для всех абзацев). Вот как это облегчает нашу работу - уже нет необходимости каждому тегу <p> прописывать атрибуты с параметрами. Все это прописываем в таблице стилей.
Но возникает другой вопрос: а если у нас какой нибудь один абзац имеет другие параметры. Другой шрифт, размер, цвет. В этом случае для этого абзаца в таблице стилей пишем отдельное правило.
Пример правила для отдельного абзаца:
.sk {
font-weight: bold;
color: #424242;
}
С помощью атрибута class мы можем любому тегу <p> прописать правило .sk с другими параметрами.
Пример:
<p class="sk">Текст абзаца</p>
И так, что бы произвести какие либо изменения на страницах сайта, нам достаточно открыть таблицу стилей и прописать изменения параметров в правилах CSS-таблицы.
Вот такое удобное для web-дизайнеров изобретение - таблицы стилей CSS.
Продолжим изучение уроков css.
|