Версия: v1.0.1

Каталог: Сниппеты Bootstrap

Категория: Элементы

Bootstrap: 3

Для CMS: HTML, Drupal, Joomla, uCoz, WordPress, Magento, OpenCart, PrestaShop

Язык: Русский

Уникальный ID: 904

Количество символов:

Посмотрели: 4772 раз

Помощь: установка & настройка

Прокомментировали: 2 раз

Рейтинг: 5.0 / 5 - 2 голосов

Тип лицензии: CC BY 4.0

Авторство: http://goo.gl/VE6KPS

Информация: Пользователям

Информация: Правообладателям

Теги: Snippet, комментарии, Comments, сниппет, Bootstrap, element, Responsive, элемент, html, адаптивные

Поделился: BootstrapТема

Добавлено: 2016-04-15 в 20:43

Метка: 1581149276

⇄ ⇅

<div class="row">
 <div class="col-md-12">
 <div class="panel panel-info">
 <div class="panel-heading">
 Комментарии
 </div>
 <div class="panel-body comments">
 <textarea class="form-control" placeholder="Оставьте Ваш комментарий" rows="5"></textarea>
 <br>
 <a class="small pull-left" href="#">Войти или зарегистрироваться</a>
 <button type="button" class="btn btn-info pull-right">Отправить</button>
 <div class="clearfix"></div>
 <hr>
 <ul class="media-list">
 <li class="media">
 <div class="comment">
 <a href="#" class="pull-left">
 <img src="https://bootstraptema.ru/snippets/element/2016/comments/com-1.jpg" alt="" class="img-circle">
 </a>
 <div class="media-body">
 <strong class="text-success">Пользователь 1</strong>
 <span class="text-muted">
 <small class="text-muted">2016-02-11</small>
 </span>
 <p>
Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария
 </p>
 </div>
 <div class="clearfix"></div>
 </div>
 <ul class="media-list">
 <li class="media">
 <div class="comment">
 <a href="#" class="pull-left">
 <img src="https://bootstraptema.ru/snippets/element/2016/comments/com-2.jpg" alt="" class="img-circle">
 </a>
 <div class="media-body">
 <strong class="text-success">Пользователь 2</strong>
 <span class="text-muted">
 <small class="text-muted">2016-02-10</small>
 </span>
 <p>
Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария
 </p>
 </div>
 <div class="clearfix"></div>
 </div>
 </li>
 <li class="media">
 <div class="comment">
 <a href="#" class="pull-left">
 <img src="https://bootstraptema.ru/snippets/element/2016/comments/com-1.jpg" alt="" class="img-circle">
 </a>
 <div class="media-body">
 <strong class="text-success">Пользователь 1</strong>
 <span class="text-muted">
 <small class="text-muted">2016-02-11</small>
 </span>
 <p>
Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария
 </p>
 </div>
 <div class="clearfix"></div>
 </div>
 </li>
 </ul>
 </li>
 <li class="media">
 <div class="comment">
 <a href="#" class="pull-left">
 <img src="https://bootstraptema.ru/snippets/element/2016/comments/com-3.jpg" alt="" class="img-circle">
 </a>
 <div class="media-body">
 <strong class="text-success">Пользователь 3</strong>
 <span class="text-muted">
 <small class="text-muted">2016-02-09</small>
 </span>
 <span class="text-muted pull-right">
 <small class="btn btn-danger btn-xs"><i class="fa fa-times"></i></small>
 </span>
 <p>
Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария
 </p>
 </div>
 <div class="clearfix"></div>
 </div>
 </li>
 <li class="media">
 <div class="comment">
 <a href="#" class="pull-left">
 <img src="https://bootstraptema.ru/snippets/element/2016/comments/com-4.jpg" alt="" class="img-circle">
 </a>
 <div class="media-body">
 <strong class="text-success">Пользователь 4</strong>
 <span class="text-muted">
 <small class="text-muted">2016-02-08</small>
 </span>
 <p>
Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария Здесь текст комментария
 </p>
 </div>
 <div class="clearfix"></div>
 </div>
 </li>
 </ul>
 </div>
 </div>
 </div>
 </div>
</div>

Всего комментариев: 2
Порядок вывода комментариев: 0 1 p21v • 21:30, 2016-11-04 И как ее заставить работать? 0 2 BootstrapТема • 10:23, 2016-11-06 На разных CMS по разному, требуется индивидуальная интеграция для каждого хостинга в отдельности.

BootstrapTema

Панель с комментариями

Скриншот

Подробнее

Похожие материалы

Просмотренные материалы