... главная страницаКарта сайтаКонтакты

Главная
Синтаксис CSS
Свойства CSS
Форматирование блоков
Списки
Пример применения стилей
Оптимизация стилей
Оформление текстов
Использование блоков
Позиционирование
Слои в CSS
Готовые решения
Дополнительные возможности CSS
Программа TopStyle
Таблица цветов

 

Все свойства CSS

 
Яндекс.Метрика
 
 

Оформление текста при помощи CSS. (стр.5)

 

 


Аналогичным образом можно уменьшить отступ после заголовка, чтобы он ближе примкнул к основному тексту. Для заголовка достаточно отрегулировать только нижнее поле элемента Н3, дописав в правило свойство margin-bottom:0.2em:

Н3{font:1.4em Arial, sans-serif; margin-bottom:0.2em;}

При этом, чтобы первый абзац все-таки больше выделялся в тексте, после него надо оставить небольшой абзацный отступ, который исчез вместе с остальными отступами. Для первого абзаца дополним правило свойством margin-bottom: 0 . 5em следующим образом:

P.firstp{font-style:italic; margin-bottom:0.5em}

Полученный в итоге результат в окне браузера Internet Explorer показан на рисунке.

Заголовок статьи

Первый параграф полностью набирается курсивом, чтобы выделить основную мысль текста и обратить на себя дополнительное внимание.

Основной текст новостной статьи. Оформляется обычным начертанием. Выделение внутри создается курсивом, чтобы не поменять оптическую насыщенность строки и раньше времени не привлечь к себе внимание.
Еще один параграф статьи, в нем выделение будет создано при помощи полужирного начертания, оно будет сразу бросаться в глаза!

Как видите, второй и третий абзацы сливаются, и снова хочется их разделить. При этом абзацные отступы нас не устраивают, но есть еще одна возможность - создать отступ первой строки, так называемую "красную строку". При этом желательно, чтобы красная строка отсутствовала у первого абзаца. Для этого дополним правило, используя свойство text-indent:

Р{font-family: Arial, sans-serif; text-align:justify; text-indent:2em; margin:0}

В результате красная строка появится и у первого абзаца - согласно принципам наследования, но мы легко можем это исправить в правиле для первого абзаца:

Р.firstp{font-style:italic; margin-bottom:0.5em; text-indent:0}

Теперь наша статья будет выглядет так:

Заголовок статьи

Первый параграф полностью набирается курсивом, чтобы выделить основную мысль текста и обратить на себя дополнительное внимание.

   Основной текст новостной статьи. Оформляется обычным начертанием. Выделение внутри создается курсивом, чтобы не поменять оптическую насыщенность строки и раньше времени не привлечь к себе внимание.
    Еще один параграф статьи, в нем выделение будет создано при помощи полужирного начертания, оно будет сразу бросаться в глаза!

 

Страница: - 1 - | - 2 - | - 3 - | - 4 - | - 5 - | - 6 - | - 7 -

 

Наверх страницы

 

Уроки CSS © 2007 - 2018 г. Все права защищены