Цветные прайсы / Прайсы / Сниппеты Bootstrap

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

Категория: Прайсы

Bootstrap: 3, 4

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

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

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

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

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

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

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

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

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

Авторство: https://goo.gl/JnThFP

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

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

Теги: Snippet, сниппет, Bootstrap, Responsive, html, прайсы, Price, адаптивные, Pricing

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

Добавлено: 2017-05-11 в 13:33

Метка: 1494498819

⇄ ⇅

.bt-pricing ul li {
 padding-top: 20px;
 padding-bottom: 20px;
 cursor: pointer;
 text-transform: uppercase;
 border-bottom: 2px solid rgba(0, 0, 0, 0.12);
 }
.bt-pricing ul li.price {
 padding: 40px 20px 20px 20px;
 font-size: 20px;
 font-weight: 900;
 }
.bt-pricing ul li.price i {
 border-radius: 50%;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
 height: 80px;
 margin: -85px auto 20px;
 width: 80px;
 font-size: 18px;
 padding: 25px;
 display: block;
 color: #fff;
 border: 4px solid #FFF;
 }
.bt-pricing .pricing-footer {
 padding: 20px;
 }
.bt-pricing .pricing-footer a i {
 margin: 5px;
 }
</style>

<div class="container">
 <div class="row">
 
 <div class="col-xs-12 col-sm-4 col-md-4 col-lg-4">
 <div class="db-wrapper">
 <div class="bt-pricing bt-pricing-color-one">
 <ul>
 <li class="price">
 <i class="glyphicon glyphicon-volume-off bt-pricing-color-one"></i>
 CLASSIC - 100 $
 </li>
<li>20 GB Space & Hosting </li>
 <li>2 Sites Upload</li>
 <li>100% Uptime Provided</li>
 <li>Noting To Write</li>
 </ul>
 <div class="pricing-footer">
<a href="#" class="btn btn-success btn-block">ORDER <i class="glyphicon glyphicon-play-circle"></i></a>
 </div>
 </div>
 </div>
 </div>

<div class="col-xs-12 col-sm-4 col-md-4 col-lg-4">
 <div class="db-wrapper">
 <div class="bt-pricing bt-pricing-color-two">
 <ul>
 <li class="price">
 <i class="glyphicon glyphicon-heart bt-pricing-color-two"></i>
 MEDIUM - 200 $
 </li>
<li>40 GB Space & Hosting </li>
 <li>5 Sites Upload</li>
 <li>100% Uptime Provided</li>
 <li>Noting To Write</li>
 </ul>
 <div class="pricing-footer">
<a href="#" class="btn btn-warning btn-block">ORDER <i class="glyphicon glyphicon-play-circle"></i></a>
 </div>
 </div>
 </div>
 </div>

<div class="col-xs-12 col-sm-4 col-md-4 col-lg-4">
 <div class="db-wrapper">
 <div class="bt-pricing bt-pricing-color-three">
 <ul>
 <li class="price">
 <i class="glyphicon glyphicon-star bt-pricing-color-three"></i>
 ULTIMATE - 300 $
 </li>
<li>60 GB Space & Hosting </li>
 <li>10 Sites Upload</li>
 <li>100% Uptime Provided</li>
 <li>Noting To Write</li>
 </ul>
 <div class="pricing-footer">
<a href="#" class="btn btn-danger btn-block">ORDER <i class="glyphicon glyphicon-play-circle"></i></a>
 </div>
 </div>
 </div>
 </div>
 
 </div> 
 </div>

BootstrapTema

Цветные прайсы

Скриншот

Подробнее

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

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

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