Иллюстрированный самоучитель по Dreamweaver MX



Три способа задания стиля


Всего стандарт CSS определяет три способа задания стиля для элемента страницы. Давайте перечислим их и дадим краткое описание каждому способу.

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

  • Внутренняя (или внедренная) таблица стилей. Таблица стилей в этом случае имеет тот же самый формат, что и внешняя, но располагается в секции заголовка той же Web-страницы и помещается внутрь специального тега <STYLE>.

  • Внутренние (также встроенные или внедренные) стили. Определение стиля помещается прямо в нужный тег, для чего используется специальный атрибут STYLE.

    С внешними таблицами стилей вы уже познакомились. Поэтому перейдем сразу к внутренним.

    Внутренняя таблица стилей по своему устройству аналогична внешней. Разница между ними в том, что внутренняя таблица стилей помещается прямо в заголовке HTML-файла. И, соответственно, может быть использована только в нем.

    Давайте превратим внешнюю таблицу стилей, созданную выше, во внутреннюю. Это проще простого.

    <STYLE>

    .cit { font-size: smaller;

    font-style: italic } I {color: #00FFOO } HI I { color: #FF0000;

    font-size: larger } </STYLE>

    Как видите, ничего радикально не изменилось. Единственное, добавился парный тег <STYLE>, определяющий таблицу стилей. Вся эта конструкция помещается в секции заголовка Web-страницы, т. е. внутри тега <HEAD>. Само собой, внутренняя таблица стилей может быть только одна на страницу.

    Обращаться к внутренней таблице стилей можно так же, как и к внешней:

    <Р CLASS="cit">Этo цитата.</Р>

    Вот, собственно, и все о внутренних таблицах стилей.

    Внутренние стили вообще помещаются внутри тегов, определяющих тот или иной элемент страницы. Делается это с помощью атрибута STYLE, поддерживаемого, как и CLASS, практически всеми тегами.




    Содержание  Назад  Вперед