Rambler's Top100 Старый русский почтовик! Оплата в WM! Самый активный, самый надежный!
Рыболовные туры в Финляндию
Рыбалка в Финляндии
с русскоговорящим гидом!
SEO sprint - Всё для максимальной раскрутки!
Форум русских рыболовов Финляндии

Рыбалка в Финляндии


главная
DHTML
таблицы стилей
способы
употребления
Несколько
примеров
Селектор CLASS
мысли о CSS
фильтры
Общие свойства
фильтров
Обработка
событий
Мультэффекты
Терминология
Тег <script>
запрос пользователю
дата и время
Переменные
объекты
Вспомогательные
материалы


КАСКАДНЫЕ ТАБЛИЦЫ СТИЛЕЙ

Часть третья.

НЕСКОЛЬКО ПРИМЕРОВ

   Учитывая то, что для некоторых (в силу их характера или склада ума) теория - трудно перевариваемое вещество, а также то, что теория требует определенной "подкованности" в рассматриваемой области, а сайт предназначен как раз для новичков в ВЕБ-строительстве, я приведу несколько практических примеров использования таблиц стилей. Так сказать, для "разжижения" скучной теории.
   На сайте уже есть некоторые образцы в статье "Несвоевременные мысли о CSS" и в ответах на ЧаВо. Напомню еще раз, что Вы можете "подсмотреть" ХТМЛ-код сайта, в том числе и примеры использования таблиц стилей (если автор не принял специальных мер против этого), кликнув на понравившейся Вам странице правой кнопкой мыши и выбрав "посмотреть в виде ХТМЛ".
   Итак, примеры... Я покажу только образцы правил, а способ их использования Вы можете выбрать сами, основываясь на данных изложенных в статье Способы употребления. Все приведенные примеры используют язык CSS.
   Любое правило каскадных таблиц состоит из двух частей: селектора и определения. Селектором может быть любой тег ХТМЛ. Определение задает, каким образом необходимо представлять этот тег. Определение записывается в фигурных скобках и, в свою очередь, тоже состоит из двух частей: свойства и значения, которые отделяются дуг от друга двоеточием. В одном правиле можно задавать несколько определений, отделяя их друг от друга точкой с запятой.
  • Задание вида заголовков.
    H1 {text-align: center;
    color: coral;
    font-size: 34pt;
    font-family: "Times New Roman"}
     
    Результат использования такой таблицы

    Будет выглядеть так.

    Здесь: text-align: center; - задает выравнивание. В данном случае - по центру.
    color: coral; - задает цвет.
    font-size: 34pt; - размер шрифта.
    font-family: "Times New Roman"; - вид шрифта.

  • Абзац.

    Пример использования таблицы стилей для форматирования текста в отдельном абзаце (или во всех, это уже на Ваше усмотрение). Этот абзац отформатирован при помощи следующих правил:
    P style="text-align: center;
    color: blue;
    font: oblique 12pt/24pt "Times Cyr", serif;"
    Свойство oblique в данном случае задает высоту шрифта 12 пунктов и высоту строк - 24 пункта.

  • Следующие две таблицы сделаны при помощи таких правил:
    border: solid 0.1em red; background-color: teal;
    td {border: solid 0.1em red; background-color: khaki;}

    причем первая строчка действует только на первую таблицу, так как стоит в теге TABLE, непосредственно создающем таблицу, а вторая - на все таблицы, которые есть на этой странице, так как стоит в теге style в заголовке страницы.

    Почтовые спонсоры, с которыми, по-моему, стоит работать.
    (Мой ТОР-10)
    WMmail.ru - заработай на чтении писем!
    socpublic.com - крутой почтовик!

    Банеры, по которым желательно кликнуть!
   Используя эти примеры, вы можете сами поэкспериментировать с таблицами стилей. А в следующих статьях продолжим рассмотрение общих положений при использовании CSS.

Создать свой сайт


Рейтинг@Mail.ru liveinternet.ru: показано число посетителей за сегодня


Copyright © 2001 by Сергей Червонящий.
Все права защищены. Запрещено частичное или полное воспроизведение материалов сайта без согласования с автором.

Покупайте на OHO.ru:
Покупайте на OHO.ru: