Как сделать красную строку html

Как сделать красную строку html

Стандарта красной строки в языке разметки HTML не существует. Однако способы создания красной строки или отступа для интернет-страниц все таки есть. Сделать красную строку на HTML не так и сложно – у этой проблемы есть несколько способов решения.

Инструкция
1
Первый способ – самый доступный и простой. Он несколько нарушает правила HTML, но это никак не влияет на оптимизацию и индексацию страниц, а также отображение текста в браузерах. Используйте тег “& nbsp;” (без кавычек и пробела) чтобы создать пробел. Для создания красной строки вставьте данный тег 3-5 раз друг за другом прямо в коде страницы. В результате вы получите отступ из нескольких пробелов. Если в код страницы ввести несколько пробелов прямо с клавиатуры, отображаться на странице будет лишь первый пробел, поэтому использование тега – довольно эффективный способ создания красной строки.
2
Второй способ – маскировка. Вы можете вставить текст, например, подчеркивание вроде “____”, и выбрать цвет шрифта, соответствующий цвету фона страницы. Этот способ имеет один минус: при выделении пользователем абзаца или всего текста, он увидит символы, замаскированные под фон. Тогда вы можете создать прозрачный PNG-файл нужного размера или файл изображения JPEG, залитый цветом, соответствующим фону сайта. Для того, чтобы изображение загрузилось моментально, задайте его высоту, равную 1 пикселю. После чего вставьте вытянутое изображение перед текстом для создания эффекта красной строки.
3
Вы можете использовать отступ text-indent и задать ему количество пикселей, отсчитываемых от начала строки. Этот способ работает на сайтах с таблицей стилей CSS. Для использования данного метода, впишите в CSS параметр:.indent{ text-indent: 20px;}После этого вы можете добавлять в HTML-код теги <p class="indent">Текст</p>.
4
Длинные объемные абзацы тяжело читаются на экранах ноутбуков и смартфонов. Поэтому, современные веб-дизайнеры пытаются использовать не красные строки, а разделение абзацев. Для создания нового абзаца используйте тег <p> в начале и </p> в конце текста, который хотите замкнуть в абзац.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *