Bootstrap 5 Оповещения Цвет ссылки

Опубликовано: 22 Февраля, 2023

Класс Bootstrap 5 Alerts Link Color используется для установки цвета элемента оповещения. Существуют разные типы предупреждений, которые указывают на разные вещи: если есть успех, цвет предупреждения будет зеленым, если это сбой, то должно отображаться предупреждение красного цвета. Каждый цвет предупреждения что-то представляет. Цвет оповещения должен быть его названием, но мы используем цвет в Alert Link, поэтому будет путаница с цветом в соответствии с названием в документации.

Предварительное условие: Bootstrap 5 Alert Component для создания оповещения — для этого мы можем использовать оповещение.

Классы цвета ссылок предупреждений:

  • alert-link: этот класс используется, чтобы сделать текст предупреждения ссылкой.
  • alert-primary: этот класс используется, чтобы сделать цвет оповещения синим.
  • alert-secondary: этот класс используется, чтобы сделать цвет оповещения серым.
  • alert-success: этот класс используется, чтобы сделать цвет оповещения зеленым.
  • alert-danger: этот класс используется, чтобы сделать цвет оповещения красным.
  • предупреждение-предупреждение: этот класс используется, чтобы сделать цвет предупреждения желтым.
  • alert-info: этот класс используется для того, чтобы сделать небесно-голубой цвет оповещения.
  • alert-light: этот класс используется, чтобы сделать цвет оповещения белым.
  • alert-dark: этот класс используется, чтобы сделать цвет оповещения темно-серым.

Синтаксис:

<div class="alert alert-primary" role="alert">
  ... <a href="#" class="alert-link">...</a>
</div>

Ниже пример иллюстрирует цвет ссылки предупреждений Bootstrap 5:

Пример 1. В этом примере мы будем использовать шесть информативных классов Alert Link Color.

Выход:

Пример 2: В этом примере мы будем использовать классы светлых и темных предупреждений для цвета, и одно предупреждение будет без класса цвета ссылки, только предупреждение-ссылка, из-за этого связанный текст будет отображаться синим цветом.

Выход:

Ссылка: https://getbootstrap.com/docs/5.0/components/alerts/#link-color