Форматирование текста в CSS

css-форматирование-текста В прошлой записи мы мы познакомились с основными семействами шрифтов, которые используются в CSS. Сегодня же мы узнаем, каким образом можно организовать форматирование текста с помощью CSS.

В который раз не могу не выразить восторг простоте CSS — многие вещи достаточно интуитивны. В качестве примера приведу, например, вот это:
font-size:12px
— уверен, вы догадались, что речь идет о размере шрифта, который будет использован в том или ином случае.
В случае использования конструкции в виде font-style:italic — речь идет о наклонном начертании текста. В целом, все это можно свести к таблице:

CSS — конструкция Что делает
font-size:12px Устанавливаем размер шрифта в пикселях или процентах
font-style:italic Указываем форматирование текста наклонным (прописным)
font-variant:small-caps Пишем большие буквы маленьким размером
font-weight:bold Отмечаем текст жирным
letter-spacing:5px Указываем дополнительное расстояние в пикселях между символами
word-spacing:7px Указываем дополнительное расстояние в пикселях между словами
color:#cc0033 Указываем цвет текста
text-indent:40px Указываем расстояние отступа начала строки в пикселях
text-decoration:underline Выделяем текст подчеркиванием
text-decoration:overline Выделяем текст надчеркиванием
text-decoration:line-through Перечеркиваем текст
text-transform:capitalize Отображаем каждое слово с большой буквы
text-transform:lowercase Все буквы будут маленькими
text-transform:uppercase Все буквы будут большими
vertical-align:super Текст будет в верхней половине индекса
vertical-align:sub Текст будет в нижней половине индекса

Пример использованный CSS-конструкций представлен ниже:

See the Pen MJPzZV by Lavrynenko (@Lavrynenko) on CodePen.

Ну и конечно же там представлен образец CSS-кода, который вы можете использовать в случае необходимости.

Спасибо за внимание! Есть вопросы — задавайте на почту или оставляйте их в комментариях.