Учебник по веб дизайну
 Свободное программное обеспечение. Доступно. Бесплатно. Легально.
Учебник
HTML
CSS
  Подключение
  Общие правила
  Классы
  Шрифт
  Текст
  Фон и цвет
  Границы
  Фильтры
DHTML
JavaScript
SSI
Раскрутка
Справочник
HTML
JavaScript
SSI
Браузеры
Хостинг
Скрипты
JavaScript
PHP
Статьи
SEO
HTML
Flash
Все об Интернет
Новости Интернет
Утилиты
Конструктор
Информер
А так же...
Наши баннеры
Контакты
Гостевая
Реклама на сайте

CSS Общие правила

Правила каскадных таблиц состоят из селектора и определения. Селектор задает элемент (например, таблица), а определение свойства этого определения (например, цвет фона таблицы). Для наиболее эффективного использования CSS необходимо иметь в виду следующие правила:

  1. Синтаксис.
  2. Группирование.
  3. Наследование.

Синтаксис

В CSS в качестве селектора выступают теги HTML. Описание задается в фигурных скобках. Если у заданного свойства несколько значений, то они отделяются друг от друга пробелами. Описания отделяются друг от друга точкой с запятой:

Тег {свойство1: значение1 значение2; свойство2: значение;}

Ниже приводится простой пример CSS, встраиваемого в HTML страницу. Не забывайте, что этот код должен располагаться внутри элемента <HEAD>.

<STYLE TYPE="text/css">
<!--
BODY {
   color: gold;
   background: blue;
   font: bold 14px Comic Sans MS;
   text-align: justify;
   margin: 10px;
}
-->
</STYLE>
Этот текст имеет вид, определенный таблицей стилей: золотые буквы на голубом фоне, жирный шрифт "Comic Sans MS" размером 14 пикселей и выровненный по обоим краям с отступами со всех сторон 10 пикселей.

Для совместимости со старыми браузерами, не понимающими CSS содержимое элемента <STYLE> желательно заключать в комментариях <!-- -->, иначе содержимое будет отображено в окне браузера. Новые умные браузеры поймут, что в коментариях заключена таблица стилей и подключат ее. Для удобства чтения/правки, в таблицу стилей можно ставить любое количество пробелов и переносов строк, браузер оставит столько, сколько нужно.

Группирование

Можно записывать селекторы через запятую, если им присваивается одинаковое определение; если селектор имеет несколько определений, то они записываются через точку с запятой.

H1 {font-family: Arial}
H2 {font-family: Arial}
H1, H2 {font-family: Arial}
H1 {font-weight: bold}
H1 {font-size: 14pt}
H1 {font-weight: bold; font-size: 14pt;}

Наследование

При определении стиля элемента, большинство вложенных элементов наследуют свойства головного элемента. Например, если в параграфе <P> задается красный цвет шрифта, то выделенный с помощью <EM> текст также будет красным.

<P>Внутри параграфа с красным цветом текста, <EM>выделенный текст</EM> наследует цвет головного тега.</P>

Внутри параграфа с красным цветом текста, выделенный текст наследует цвет головного тега.

Наследование удобно использовать для описания свойств элементов по умолчанию. Для этого необходимо описать стиль элемента, порождающего все остальные элементы HTML документа, т.е. тега <BODY>.

Реклама

Если твой компьютер завис - выдерни шнур, выдави стекло.
главная :: наверх :: добавить в избранное :: сделать стартовой :: рекомендовать другу :: карта сайта

Rambler's Top100

Страница сгенерированна за 0.0136 сек.
Сайт оптимизирован под разрешение 800х600 и браузер MS IE 6.0.
Copyright © 2005-2010 originweb.info, design.originweb.info.
Хостинг ruweb.net