Какие существуют способы оформления текста (абзацев) с помощью CSS?

Отступы [text-indent]

Свойство text-indent позволяет выделить параграф с помощью установки отступа для его первой строки.

margin - Задает или получает ширину отступа от четырех сторон объекта
H4 {margin:1cm;}
body {margin:5mm;}

margin-top - Задает или получает высоту верхнего отступа объекта
H5 {margin-top:3cm;}

margin-left - Задает или получает ширину левого отступа объекта
img {margin-left:2cm;}

margin-right - Задает или получает ширину правого отступа объекта
img {margin-right:2cm;}

margin-bottom - Задает или получает высоту нижнего отступа объекта
img {margin-bottom:2cm;}

padding - Задает или получает величину пространтства, вставляемого между объектом и его отступом или, если объект имеет границы, между объектом и его границей
td {padding:2cm;}

padding-bottom - Задает или получает величину пространтства, вставляемого между объектом его нижней границей
td {padding-bottom:2cm;}

padding-left - Задает или получает величину пространтства, вставляемого между объектом его левой границей
td {padding-left:2cm;}

padding-right - Задает или получает величину пространтства, вставляемого между объектом его правой границей
td {padding-right:2cm;}

padding-top - Задает или получает величину пространтства, вставляемого между объектом его верхней границей

Выравнивание текста [text-align]

CSS-свойство text-align соответствует атрибуту, используемому в старых версиях HTML. Текст может быть выровнен left, right, centred или justify.

Декоративный вариант [text-decoration]

Форматирование и установка стиля текста - основная проблема для любого web-дизайнера. На этой странице вы увидите и узнаете об изумительных возможностях CSS при отображении текста. Мы рассмотрим следующие свойства:

* text-indent
* text-align
* text-decoration
* letter-spacing
* text-transform

Интервал между буквами [letter-spacing]

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

Свойство word-spacing

Это свойство позволяет задать расстояние между словами. В качестве значения допускаются любые единицы длины, как с положительными значениями, так и с отрицательными. При отрицательных значениях расстояние между словами уменьшается, и при слишком больших значениях слова могут сильно "сближаться" или даже "наезжать" друг на друга. Это отрицательно скажется на читаемости текста, поэтому будьте аккуратнее при задании таких значений. Задание значений в процентах не допускается.

Свойство letter-spacing

Данное свойство задает расстояние между буквами внутри слова. Задается аналогично расстоянию между словами в любых единицах длины. Допускается задание отрицательных значений, при которых буквы могут слишком плотно примыкать друг к другу или даже налегать друг на друга. Поэтому пользуйтесь им осторожнее. Задание величины в процентах не допускается.

При помощи этого свойства можно разрежать буквы, например в заголовках, что выгладит довольно оригинально. При этом рекомендуется, чтобы, с одной стороны, расстояние между буквами было увеличено настолько значительно, чтобы визуально заголовок выделялся на фоне обычного текста, а с другой стороны - разрежение не должно быть слишком большим, чтобы не ухудшалось общее восприятие текста.

Оба свойства word-spacing и letter-spacing можно использовать совместно, так как при увеличении расстояния между буквами, для того чтобы сохранить читаемость и разделить слова, может потребоваться одновременно увеличить и расстояние между словами.

Трансформация текста [text-transform]

Свойство text-transform управляет регистром символов. Можно выбрать capitalize, uppercase или lowercase, в зависимости от того, как выглядит текст в оригинальном HTML-коде.

Например, слово "headline" можно показать "HEADLINE" или "Headline". Имеются четыре возможных значения text-transform:

capitalize

Капитализирует каждое слово. Например: "john doe" станет "John Doe".

uppercase

Конвертирует все символы в верхний регистр. Например: "john doe" станет "JOHN DOE".

lowercase

Конвертирует все символы в нижний регистр. Например: "JOHN DOE" станет "john doe".

none

Трансформации нет - текст отображается так же, как в HTML-коде.