Каскадні таблиці стилів
CSS поради & прийоми

(Эта страничка использует каскадные таблицы стилей CSS)

Цей документ є перекладом статті з сайту W3C.
Оригінальна версія документу знаходиться тільки на сайті W3C http://www.w3.org/Style/Examples/007/shadows.html
Цей переклад НЕ є офіційним документом W3C.
Всі Авторські Права Належать W3C.
Цей документ може містить помилки перекладу та похибки.
Автор: Скрипець Євген - розробник SiteSpeedLab (всі переклади автора: en, ru, uk )
Локальна копія: http://www.indeep76.com/Style/Example007ukr/indent.html

Абзац з червоного рядку

Eiffel tower

Зменшена модель Ейфелевої башти у парку 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 Valid CSS!Valid HTML 4.0!

Bert Bos
Документ створено Feb 2003;
Остання зміна документу $Date: 2007/07/20 16:16:25 $ GMT