Для каждого абзаца добавить отступ первой строки - «Отступы и поля» » Самоучитель CSS
Меню
Наши новости
Учебник CSS

Невозможно отучить людей изучать самые ненужные предметы.

Введение в CSS
Преимущества стилей
Добавления стилей
Типы носителей
Базовый синтаксис
Значения стилевых свойств
Селекторы тегов
Классы
CSS3

Надо знать обо всем понемножку, но все о немногом.

Идентификаторы
Контекстные селекторы
Соседние селекторы
Дочерние селекторы
Селекторы атрибутов
Универсальный селектор
Псевдоклассы
Псевдоэлементы

Кто умеет, тот делает. Кто не умеет, тот учит. Кто не умеет учить - становится деканом. (Т. Мартин)

Группирование
Наследование
Каскадирование
Валидация
Идентификаторы и классы
Написание эффективного кода

Самоучитель CSS

Вёрстка
Изображения
Текст
Цвет
Линии и рамки
Углы
Списки
Ссылки
Дизайны сайтов
Формы
Таблицы
CSS3
HTML5

Новости

Блог для вебмастеров
Новости мира Интернет
Сайтостроение
Ремонт и советы
Все новости

Справочник CSS

Справочник от А до Я
HTML, CSS, JavaScript

Афоризмы

Афоризмы о учёбе
Статьи об афоризмах
Все Афоризмы

Видео Уроки


Наш опрос



Наши новости

       
25-03-2016, 16:40
Для каждого абзаца добавить отступ первой строки - «Отступы и поля»
Рейтинг:

Internet Explorer Chrome Opera Safari Firefox Android iOS
4.0+ 1.0+ 4.0+ 1.0+ 1.0+ 1.0+ 1.0+

Задача

Добавить отступ к первой строке каждого абзаца.

Решение

Когда требуется установить абзацный отступ, который ещё называется красной строкой, лучше всего использовать стилевое свойство text-indent. Его значение определяет насколько сдвинуть текст первой строки вправо от исходного положения. Ширина текстового блока при этом не меняется и остается заданной изначально. Величину отступа можно указывать в пикселах, процентах или других доступных единицах (пример 1).

Пример 1. Отступ первой строки

HTML5CSS 2.1IECrOpSaFx

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Отступ первой строки</title>
  <style>
   p {
    text-indent: 20px; /* Отступ первой строки в пикселах */
   }
  </style>
 </head>
 <body>
  <p>Вавилонским столпотворением, по библейскому преданию, называется неудавшаяся 
     попытка царя Нимрода построить в Вавилоне столп высотой до неба. Бог, 
     разгневавшись на людей за их безрассудное желание, решил покарать 
     строителей: он смешал их язык так, что они перестали понимать друг друга, 
     вынуждены были прекратить стройку и мало-помалу рассеялись по свету. Отсюда, 
     как объясняли древние, и пошло различие языков.</p>
  <p>В обычном понятии вавилонское столпотворение означает беспорядок, неразбериху 
     при большом скоплении народа.</p>
 </body>
</html>

Результат данного примера показан на рис. 1.

 


Рис. 1. Вид текста с отступами первой строки


Internet Explorer Chrome Opera Safari Firefox Android iOS 4.0 1.0 4.0 1.0 1.0 1.0 1.0 Задача Добавить отступ к первой строке каждого абзаца. Решение Когда требуется установить абзацный отступ, который ещё называется красной строкой, лучше всего использовать стилевое свойство text-indent. Его значение определяет насколько сдвинуть текст первой строки вправо от исходного положения. Ширина текстового блока при этом не меняется и остается заданной изначально. Величину отступа можно указывать в пикселах, процентах или других доступных единицах (пример 1). Пример 1. Отступ первой строки HTML5 CSS 2.1 IE Cr Op Sa Fx Результат данного примера показан на рис. 1. Рис. 1. Вид текста с отступами первой строки
Просмотров: 1 711
Комментариев: 2:   25-03-2016, 16:40
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь. Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

 
Еще новости по теме:



Другие новости по теме: