Основы HTML

  1. Термины и определения
  2. Принципы WEB 2.0
  3. Структура HTML-документа
  4. Основные метатеги
  5. Форматирование текста HTML
  6. Списки
  7. Текст фиксированного формата
  8. Выделение фрагментов текста
  9. Изменение параметров шрифта
  10. Графика
  11. Таблицы
  12. Гиперссылки
  13. Изображения-карты
  14. Фреймы

Основы CSS3

  1. Что такое CSS
  2. Синтаксис CSS
  3. Стилевые классы
  4. Комбинированные стили
  5. Таблицы CSS
  6. Правила каскадности CSS
  7. Рекомендации применения стилей
  8. Параметры шрифтов
  9. Разрывы строк, вертикальное выравнивание
  10. Параметры фона
  11. Параметры абзаца
  12. Параметры списков
  13. Параметры курсора
  14. Параметры отступов
  15. Параметры рамки
  16. Параметры выделения
  17. Параметры отображения
  18. Контейнеры


   

Комбинированные стили CSS

CSS позволяет создавать стили с несколькими селекторами одновременно. Такие стили называются комбинированными.

Комбинированные стили предназначены для привязки к тегам, которые удовлетворяют одновременно нескольким условиям. Веб-мастер может назначить комбинированный стиль к тегу, вложенному в другой тег или к тегу, для которого указан определенный стилевой класс.

Правила для написания селекторов в комбинированном стиле:

Данные правила сложны для понимания, поэтому, лучше всего понять их работу на практических примерах.

ПРИМЕР 1:

P STRONG {color: Red}
...
<P>Этот текст будет <STRONG>красным и жирным</STRONG></P>
<P>Это простой текст</P>

В примере 1 в качестве селекторов используются теги <P>, <STRONG>. Тег <STRONG> должен быть вложен в тег <P>. Стиль будет привязан только к тегу <STRONG>.

ПРИМЕР 2:

P.blue {color: #0000FF}
...
<P CLASS="blue">Этот текст будет отображен синим цветом.</P>
<P>Это простой текст</P>
ПРИМЕР 3:

P.blue <EM> {color: #0000FF}
...
<P CLASS="blue">Этот текст будет <EM>синим и наклонным</EM>.</P>
<P>Это простой текст</P>

В примере 3 стиль будет применен только к фрагменту "синим и наклонным". Стиль "окрасит" цвет текста в синий, а тег <EM> сделает его наклонным.

Стандарт CSS разрешает определять одновременно несколько разных стилей, которые перечисляются через запятую.

H2, .warning, P STRONG <EM> {font-size: 10px}

В этом примере три разных стиля (стиль переопределения тега; стилевой класс; комбинированный стиль) задают размер шрифта в 10 пикселей.

Встроенные стили

Встроенные стили применяются редко. Они нарушают концепцию Web 2.0. Обычно встроенные стили применяют к единственному элементу html-страницы или во время экспериментов со стилями.

Встроенный стиль указывается в качестве атрибута STYLE конкретного тега.

<P STYLE="color: Red; font-size: 14px">Красный текст размером 14</P>

TOP ↑