Как задать стиль текста в css
CSS предоставляет нам много возможностей для стилизации текста. Так, например, с помощью CSS мы можем влиять на:
- Размер;
- Цвет;
- Насыщенность;
- Выравнивание.
Размер текста
Размер текста задается с помощью свойства font-size
. В качестве единиц измерения размера мы можем использовать как абсолютные, например, пиксели (px
), так и относительные, к которым относятся проценты (%
), а также em
и rem
.
em
показывает во сколько раз размер шрифта будет больше, чем у ближайшего вычисленного значения font-size
(например, у ближайшего родительского элемента), а rem
показывает во сколько раз размер шрифта будет больше, чем размер шрифта у корневого элемента, то есть у <html>
.
Цвет текста
Для управления цветом используется свойство color
. В качестве значения данное свойство принимает цвет в разных форматах цветового пространства, включая форматы HEX и RGB.
Насыщенность текста
С помощью насыщенности можно выделить нужный нам участок текста. Задать значение насыщенности можно с помощью свойства font-weight
, которое принимает следующие значения:
normal
- значение по умолчанию. Обычное начертание текстаbold
- жирное начертание текстаbolder
- сверхжирное начертаниеlighter
- сверхтонкое начертание- Числовые значения насыщенности от 100 до 900 с шагом 100.
Выравнивание текста
Выравнивание текста регулируется CSS свойством text-align
, которое принимает одно из следующих значений:
left
- выравнивание по левому краю страницы. Это значение по умолчаниюright
- выравнивание по краю страницыcenter
- выравнивание текста по центруjustify
- выравнивание по ширине.
В качестве пример рассмотрим оформление текста для параграфа:
p {
color: #333333;
font-size: 18px;
font-weight: bold;
text-align: center;
}
В этом примере мы задали для текста внутри параграфа неглубокий чёрный текст размером 18 пикселей с жирным начертанием, который мы выровняли по центру.