Skip to main content

Выноски, уведомления, замечания

Вариант 1.

Для оформления блока выноски, уведомления, замечания применяется следующая конструкция:

<div class="call-out">
    <p><strong>Прием заявлений осуществляется:</strong></p>
    <ul class="check">
        <li>Понедельник: 08:30 до 18:00</li>
        <li>Вторник- пятница: 08:30 до 17:00</li>
        <li>Обед: 12:30 – 14:00</li>
    </ul>
    <p>class="callout"</p>
</div>

получим вот такой блок:

Прием заявлений осуществляется:
  • Понедельник: 08:30 до 18:00
  • Вторник- пятница: 08:30 до 17:00
  • Обед: 12:30 – 14:00

 

Мы можем разнообразить наш блок цветовыми решениями, для этого в класс class="call-out" необходимо добавить класс с обозначением цвета например: class="call-out success"

  • success - зеленый цвет
  • danger - красный цвет
  • info - синий цвет
  • warning - оранжевый цвет

например:

class="callout success"
class="callout danger"
class="callout info"
class="callout warning"

 

Вариант 2.

Для оформления блока выноски, уведомления, замечания второго варианта применяется следующая конструкция:

<div class="alerte">
    <p><strong>Прием заявлений осуществляется:</strong></p>
    <ul class="check">
        <li>Понедельник: 08:30 до 18:00</li>
        <li>Вторник- пятница: 08:30 до 17:00</li>
        <li>Обед: 12:30 – 14:00</li>
    </ul>
    <p>class="alerte background color aborder"</p>
</div>

Пример:

Прием заявлений осуществляется:
  • Понедельник: 08:30 до 18:00
  • Вторник- пятница: 08:30 до 17:00
  • Обед: 12:30 – 14:00

Вариант 2 можно значительно разнообразить:

  • добавить цвет:
    • серый цвет - class="alerte color"
    • синий цвет - class="alerte info color"
    • оранжевый цвет - class="alerte warning color"
    • зелёный цвет - class="alerte succes color"
    • красный цвет - class="alerte danger color"
  • добавить фон:
    • серый цвет фона - class="alerte background"
    • синий цвет фона - class="alerte info background"
    • оранжевый цвет фона - class="alerte warning background"
    • зелёный цвет фона - class="alerte succes background"
    • красный цвет фона - class="alerte danger background"
  • добавить бордюр:
    • серый цвет бордюра - class="alerte aborder"
    • синий цвет бордюра - class="alerte info aborder"
    • оранжевый цвет бордюра - class="alerte warning aborder"
    • зелёный цвет бордюра - class="alerte succes aborder"
    • красный цвет бордюра - class="alerte danger aborder"

пример:

class="alerte info color"

class="alerte warning background"

class="alerte succes aborder"

class="alerte danger background color aborder"