Красная строка

Метки:

Красная строка предназначена для обозначения нового абзаца и помечается специальным сдвигом первой строки абзаца.

На веб-странице абзацы обычно выделяются отбивкой, но такое обособление можно усилить и с помощью красной строки. Для этой цели применяется стилевой атрибут text-indent, добавляемый к селектору P, как показано в примере 1.

Пример 1. Добавление красной строки

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html;  charset=windows-1251">
  <title>Красная строка</title>
  <style type="text/css">
   P {
    text-indent: 20px; /* Отступ первой строки в пикселах */
   }
  </style>
 </head>
 <body>
  <p>Теперь лезвие лежит в шкатулке вперемежку с бижутерией. Когда же я на него 
     натыкалась, оно снова напоминало мне о безумной  девушке убившей своего 
     неверного любовника.</p>
 </body>
</html>

Результат данного примера показан на рис. 1. Первая строка сдвинута вправо на 20 пикселов от левой границы текстового блока.

Рис. 1

Рис. 1. Текст с абзацным отступом

Величину отступа придется подбирать опытным путем исходя из размера шрифта, его типа и ширины блока текста.

   

Если использовать em вместо px, то отступ будет зависеть от гарнитуры.

тест: <code>em</code>

   

Отправить комментарий

  • Строки и параграфы переносятся автоматически.
CAPTCHA
Вопрос для защиты от спама.
2 + 0 =
Решите этот простой пример и введите результат. Так, для 1+3 надо ввести 4.