Бутстрап 4 цвета
Цвета текста
В Bootstrap 4 есть несколько контекстных классов, которые можно использовать для предоставления «значения через цвета».
Классы для цветов текста: .text-muted
,
.text-primary
, .text-success
, .text-info
,
.text-warning
, .text-danger
, .text-secondary
, .text-white
,
.text-dark
, .text-body
(цвет тела по умолчанию/часто черный) и .text-light
:
Пример
This text is muted.
This text is important.
This text indicates success.
This text represents some information.
This text represents a warning.
This text represents danger.
Secondary text.
Dark grey text.
Body text.
Light grey text.
Контекстные текстовые классы также можно использовать для ссылок, которые добавят более темный цвет при наведении:
Пример
Вы также можете добавить непрозрачность 50% для черного или белого текста с помощью классов .text-black-50
или :.text-white-50
Пример
Black text with 50% opacity on white background
White text with 50% opacity on black background
Цвета фона
Классы для цветов фона: .bg-primary
,
.bg-success
, .bg-info
, .bg-warning
, .bg-danger
, .bg-secondary
, .bg-dark
и .bg-light
.
Обратите внимание, что цвета фона не задают цвет текста, поэтому в некоторых случаях вы захотите использовать их вместе с .text-*
классом.
Пример
This text is important.
This text indicates success.
This text represents some information.
This text represents a warning.
This text represents danger.
Secondary background color.
Dark grey background color.
Light grey background color.