Български превод на "Indented paragraphs"

Настоящият документ е превод на статията "Indented paragraphs".

Оригиналната версия на документа се намира само на уебсайта на W3C http://www.w3.org/Style/Examples/007/indent.
Това НЕ е официален документ на W3C. Всички авторски права принадлежат на W3C.

Автор: Александър Дичев (всички преводи на автора). Новини в блога.
Преводът е направен на 24.08.2008. Последна актуализация на 17.12.2008.

Настоящият документ може да съдържа грешки или неточности в превода.
Ако желаете да предложите корекция или да сигнализирате за грешка, свържете се с автора.

Документът е преведен със съдействието на Today's Moon и Фази на луната.

Web Style Sheets
CSS съвети и трикове

(Тази страница използва CSS style sheets)

Назъбени параграфи

Айфеловата кула

Умален модел на Айфеловата кула в Parc Mini-France

Ето нещо просто: да започнем по-навътре първия ред на всеки параграф. Чрез тях много хора четат по-лесно, от колкото чрез празни редове между параграфите, особено при по-дълги текстове, и позволява резервирането на празните редове за по-важни паузи.

Трикът тук се състои в това, да вдлъбнем само тези параграфи, които са предшествани от други параграфи. Не е необходимо да се вдлъбва първият параграф от страницата, нито пък параграфи, следващи диаграма, заглавие или нещо друго, изместено от текста. Правилата за това са много прости:

p {
  margin-bottom: 0 }
p + p {
  text-indent: 1.5em;
  margin-top: 0 }

Това вдлъбва първия ред само, когато е предшестван от друг параграф. Това също спестява пространството под всички параграфи и преди вдлъбнатите абзаци. Но ще разберете, че на практика, все още са необходими изключения.

В тази страница, например, има елементи P, използвани като заглавия за изображения (виж пример за “Фигури и заглавия”). Центрирани са и по тази причина, не е необходимо да са вдлъбнати. Простото правило 'p.caption {text-indent: 0}' се справя с това. Може да видите, че в примера действително е оказано това правило.

Сега е възможно използването на различни разстояния между параграфите за да се индикират важни паузи в текста. Нека да дефинираме три различни класа: stb (малка тематична пауза), mtb (средна тематична пауза) и ltb (голяма тематична пауза). Този параграф е от клас stb, така че ефекта може да се види.

p.stb { text-indent: 0; margin-top: 0.83em }
p.mtb { text-indent: 0; margin-top: 2.17em }
p.ltb { text-indent: 0; margin-top: 3.08em }

CSS Валиден CSS!Валиден HTML 4.0!

Bert Bos
създадено на 17 Jan 2001;
последна промяна $Date: 2008/07/07 15:03:47 $ GMT