Bootstrap 3 блоки пользователей / Блоки / Сниппеты Bootstrap

Версия: v1.0

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

Категория: Блоки

Bootstrap: 3

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

Язык: Английский

Вес файла: 472.5 Kb

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

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

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

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

Прикреплён файл №2: /stuff/0-0-0-874-20

Скачали бесплатно: 87 раз

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

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

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

Авторство: bootstraptema.ru

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

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

Теги: адаптивный, Snippet, блок, сниппет, Bootstrap, Responsive, html, Block

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

Добавлено: 2016-04-10 в 17:17

Метка: 1581169656

⇄ ⇅

<!DOCTYPE html>

<div class="container">
<div class="row">
 
 <div class="col-md-3">
 <div class="panel block-profile">
 <div style="background-image: url('https://bootstraptema.ru/images/bg/bg-4.png')" class="panel-body text-center bg-center">
 <div class="row profile-name">
 <div class="col-xs-12 text-white">
 <img src="https://bootstraptema.ru/snippets/block/2016/b3-blocks-users/rd1-400x400.jpg" alt="Image" class="img-thumbnail img-circle profile-images">
 <h3>Alisa</h3>
 <p>
 <em class="fa fa-twitter fa-fw"></em>&#64;alisa</p>
 </div>
 </div>
 </div>
 <div class="panel-body text-center">
 <div class="row profile-name">
 <div class="col-xs-4">
 <a href="#" class="text-danger">
 <em class="fa fa-twitter fa-2x"></em>
 </a>
 </div>
 <div class="col-xs-4">
 <a href="#" class="text-danger">
 <em class="fa fa-facebook fa-2x"></em>
 </a>
 </div>
 <div class="col-xs-4">
 <a href="#" class="text-danger">
 <em class="fa fa-envelope-o fa-2x"></em>
 </a>
 </div>
 </div>
 </div>
 <div class="list-group">
 <a href="#" class="list-group-item">
 <span class="label label-danger pull-right">14:40</span>
 <em class="fa fa-fw fa-clock-o text-muted"></em>Recent Activity</a>
 <a href="#" class="list-group-item">
 <span class="label label-danger pull-right">Russia</span>
 <em class="fa fa-fw fa-globe text-muted"></em>Location</a>
 <a href="#" class="list-group-item">
 <span class="label label-danger pull-right">&#9733 &#9733 &#9733 &#9733 &#9733</span>
 <em class="fa fa-fw fa-folder-open-o text-muted"></em>Rating</a>
 </div>
 </div>
 </div>
 
<div class="col-md-3">
 <div class="panel block-profile">
 <div style="background-image: url('https://bootstraptema.ru/images/bg/bg-3.png')" class="panel-body text-center bg-center">
 <div class="row profile-name">
 <div class="col-xs-12 text-white">
 <img src="https://bootstraptema.ru/snippets/block/2016/b3-blocks-users/rd2-400x400.jpg" alt="Image" class="img-thumbnail img-circle profile-images">
 <h3>Limpa</h3>
 <p>
 <em class="fa fa-twitter fa-fw"></em>&#64;limpa</p>
 </div>
 </div>
 </div>
 <div class="panel-body text-center">
 <div class="row profile-name">
 <div class="col-xs-4">
 <a href="#" class="text-primary">
 <em class="fa fa-twitter fa-2x"></em>
 </a>
 </div>
 <div class="col-xs-4">
 <a href="#" class="text-primary">
 <em class="fa fa-facebook fa-2x"></em>
 </a>
 </div>
 <div class="col-xs-4">
 <a href="#" class="text-primary">
 <em class="fa fa-envelope-o fa-2x"></em>
 </a>
 </div>
 </div>
 </div>
 <div class="list-group">
 <a href="#" class="list-group-item">
 <span class="label label-primary pull-right">18:10</span>
 <em class="fa fa-fw fa-clock-o text-muted"></em>Recent Activity</a>
 <a href="#" class="list-group-item">
 <span class="label label-primary pull-right">Albania</span>
 <em class="fa fa-fw fa-globe text-muted"></em>Location</a>
 <a href="#" class="list-group-item">
 <span class="label label-primary pull-right">&#9733 &#9733 &#9733 &#9733</span>
 <em class="fa fa-fw fa-folder-open-o text-muted"></em>Rating</a>
 </div>
 </div>
 </div>

<div class="col-md-3">
 <div class="panel block-profile">
 <div style="background-image: url('https://bootstraptema.ru/images/bg/bg-5.png')" class="panel-body text-center bg-center">
 <div class="row profile-name">
 <div class="col-xs-12 text-white">
 <img src="https://bootstraptema.ru/snippets/block/2016/b3-blocks-users/rd3-400x400.jpg" alt="Image" class="img-thumbnail img-circle profile-images">
 <h3>Smirna</h3>
 <p>
 <em class="fa fa-twitter fa-fw"></em>&#64;smirna</p>
 </div>
 </div>
 </div>
 <div class="panel-body text-center">
 <div class="row profile-name">
 <div class="col-xs-4">
 <a href="#" class="text-success">
 <em class="fa fa-twitter fa-2x"></em>
 </a>
 </div>
 <div class="col-xs-4">
 <a href="#" class="text-success">
 <em class="fa fa-facebook fa-2x"></em>
 </a>
 </div>
 <div class="col-xs-4">
 <a href="#" class="text-success">
 <em class="fa fa-envelope-o fa-2x"></em>
 </a>
 </div>
 </div>
 </div>
 <div class="list-group">
 <a href="#" class="list-group-item">
 <span class="label label-success pull-right">17:58</span>
 <em class="fa fa-fw fa-clock-o text-muted"></em>Recent Activity</a>
 <a href="#" class="list-group-item">
 <span class="label label-success pull-right">Greece</span>
 <em class="fa fa-fw fa-globe text-muted"></em>Location</a>
 <a href="#" class="list-group-item">
 <span class="label label-success pull-right">&#9733 &#9733 &#9733</span>
 <em class="fa fa-fw fa-folder-open-o text-muted"></em>Rating</a>
 </div>
 </div>
 </div>

<div class="col-md-3">
 <div class="panel block-profile">
 <div style="background-image: url('https://bootstraptema.ru/images/bg/bg-1.png')" class="panel-body text-center bg-center">
 <div class="row profile-name">
 <div class="col-xs-12 text-white">
 <img src="https://bootstraptema.ru/snippets/block/2016/b3-blocks-users/rd4-400x400.jpg" alt="Image" class="img-thumbnail img-circle profile-images">
 <h3>Safyana</h3>
 <p>
 <em class="fa fa-twitter fa-fw"></em>&#64;safyana</p>
 </div>
 </div>
 </div>
 <div class="panel-body text-center">
 <div class="row profile-name">
 <div class="col-xs-4">
 <a href="#" class="text-info">
 <em class="fa fa-twitter fa-2x"></em>
 </a>
 </div>
 <div class="col-xs-4">
 <a href="#" class="text-info">
 <em class="fa fa-facebook fa-2x"></em>
 </a>
 </div>
 <div class="col-xs-4">
 <a href="#" class="text-info">
 <em class="fa fa-envelope-o fa-2x"></em>
 </a>
 </div>
 </div>
 </div>
 <div class="list-group">
 <a href="#" class="list-group-item">
 <span class="label label-info pull-right">18:00</span>
 <em class="fa fa-fw fa-clock-o text-muted"></em>Recent Activity</a>
 <a href="#" class="list-group-item">
 <span class="label label-info pull-right">Spain</span>
 <em class="fa fa-fw fa-globe text-muted"></em>Location</a>
 <a href="#" class="list-group-item">
 <span class="label label-info pull-right">&#9733 &#9733 &#9733 &#9733</span>
 <em class="fa fa-fw fa-folder-open-o text-muted"></em>Rating</a>
 </div>
 </div>
 </div>

</div>
</div>

BootstrapTema

Bootstrap 3 блоки пользователей

Скриншот

Подробнее

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

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

Всего комментариев: 0