PipUI v1.6.0
  • 🌟Введиние
  • 🗃️Скачать
  • ⚠️Начало работы
  • Компоненты
    • Базовый набор
    • Отступы
    • Палитра цветов
    • Grid сетка
    • Панель навигации
    • Выпадающее меню
    • Постраничная навигация
    • Формы
    • Кнопки
    • Полосы прогресса
    • Меню навигации
    • Модальные окна
    • Оповещения
    • Подтверждения действий
    • Вкладки
    • Хлебные крошки
    • Спойлеры
    • Таблицы
    • Панель BB-кодов
    • BB-коды
    • Валидаторы форм
    • Индексы полей ввода
    • Всплывающие подсказки
    • Подсвечивающиеся блоки
    • Всплывающие блоки
    • Слайдер
    • Автозаполнение
    • Селектор тегов
    • Блоки оповещений
    • Селекторы даты и времени
    • Якоря
  • 📧Контакты
  • 🔁GitHub
Powered by GitBook
On this page
  1. Компоненты

BB-коды

coВ составе фреймворка PipUI есть компонент с заготовленными стилями для BB-кодов. Всё что необходимо сделать, это выставить необходимую разметку или классы

Жирное начертание шрифта (теги [b][/b])

<span class="bb-bold">Жирное начертание шрифта</span>

Наклонный текст (теги [i][/i])

<span class="bb-italic">Наклонный текст</span>

Зачеркнутый текст (теги [s][/s])

<span class="bb-strike">Зачеркнутый текст</span>

Подчеркнутый текст (теги [u][/u])

<span class="bb-underline">Подчеркнутый текст</span>

Выравнивание по левому краю (теги [left][/left])

<div class="bb-text-left">Выравнивание по левому краю</div> 

Выравнивание по правому краю (теги [right][/right])

<div class="bb-text-right">Выравнивание по правому краю</div> 

Выравнивание по центру (теги [center][/center])

<div class="bb-text-center">Выравнивание по центру</div> 

Горизонтальная линия (тег [line])

<div class="bb-line"></div> 

Скрытый текст (теги [spoiler="Показать/Скрыть"][/spoiler])

<div class="bb-spoiler-wrapper">
    <div class="bb-spoiler">
        <a href="#" class="bb-spoiler-trigger">Показать/Скрыть</a>
        <div class="bb-spoiler-text">Скрытый текст!</div>
    </div>
</div>

Изображение (теги [img]url[/img])

<img src="/Themes/Default/img/logo.svg" alt="IMG" class="bb-image" /> 

Цитата (теги [quote][/quote])

<div class="bb-quote-wrapper">
    <div class="bb-quote">
        <div class="bb-quote-title">PipUI - 01.01.2019</div>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Commodi, in.
    </div>
</div>

Вставка кода (теги [code][/code])

<div class="bb-code">
    <div class="bb-code-language">Javascript</div>
    <div class="bb-code-text">alert('PipUI');</div>
</div>

Вставка YouTube проигрывателя (теги [youtube][/youtube])

<div class="bb-youtube">
    <iframe width="510" height="287" src="https://www.youtube.com/embed/eY52Zsg-KVI" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
PreviousПанель BB-кодовNextВалидаторы форм

Last updated 2 years ago