CSS  Основы

Как выглядит таблица стилей?

Таблица стилей состоит из правил, которые выглядят примерно так:

H3 {
    font-family: Arial;
    font-style: italic;
    color: green
   }


Каждое правило начинается с селектора, который в приведенном выше примере является H3. Селектором обычно является один или несколько элементов HTML (тегов), и объявления внутри правила описывают, как эти элементы должны отображаться. Объявление - это просто свойство CSS, за которым следует значение. Например, объявление "font-style: italic;" состоит из свойства "font-style", за которым следует значение "italic". Таким образом, в этом примере говорится, что каждый тег <H3> должен использовать шрифт Arial курсивом и иметь зеленый цвет.

Вы также можете использовать классы как селекторы, которые не привязаны к конкретным элементам HTML. Например, рассмотрим это правило:

.greenitalic {
    font-family: Arial;
    font-style: italic;
    color: green
    }

Блок объявления такой же, как в предыдущем примере, но вместо того, чтобы использовать H3 в качестве селектора, мы используем класс .greenitalic. Обратите внимание, что .greenitalic не означает ничего особенного - вы можете использовать что угодно в качестве имени класса при условии, что оно начинается с точки и состоит из одного слова (пробелы и подчеркивания не допускаются).

Чтобы применить класс к тегу HTML, вы используете атрибут класса (который был представлен в HTML 4.0). Например, чтобы применить вышеуказанный стиль к тегу <H3>, вы должны использовать:

   <H3 CLASS="greenitalic">this is greenitalic<H3>

(обратите внимание, что период до имени класса не включен).

« Назад Далее »