Материал
По возможности мы всех призываем указывать источник материала если вы нашли у нас что-то дейстительно интересное и новое для себя.

Понравился материал? Поделись с ним в социальных сетях !

Источник
Ссылки

Используйте быстрые ссылки для вставки в сообщениях форума.

Ccылка
BB-Code
HTML-код

Информационные таблички для uCoz

Дата и время публикации : 20.Ноя.17 в 15:27 | Раздел : Прочее для uCoz


Параметр Значение
Дата публик. 20.Ноя.17, Понедельник, 15:27
Адапт. дизайн
Обновления Не производились
Просмотрен 81

Красивые информационные таблички от uOn. Могут применяться абсолютно везде, имеют адаптивный дизайн, поэтому корректно отображаться будут на любом устройстве.

Иконки используются благодаря иконочному шрифту FontAwesome, если у вас он не установлен, то обязательно поставьте его к себе на сайт для отображения иконок.

Установка:

1. Устанавливаем в стили CSS :

.update-nag{  display: inline-block;  font-size: 14px;  text-align: left;  background-color: #fff;  height: 100%;  width:100%;  margin-bottom: 10px;  border-radius: 3px;
}  .update-nag > .update-text{  line-height: 19px;
padding: 6px;
}  .redtable {  background-color: rgba(192, 57, 43,0.4);  color:#c0392b;
}  .bluetable{  background-color: rgba(52, 152, 219,0.4);  color:#3498db;   }  .greentable{  background-color: rgba(39, 174, 96,0.4);  color:#27ae60;   }   .orangetable{  background-color: rgba(243, 156, 18,0.4);  color:#f39c12;   }   .whitetable{  background-color: rgba(255,255,255,0.4);  color:#000;   }


2. А теперь устанавливаем табличку нужного цвета туда где вы хотите чтобы она отображалась :

Оранжевая :

<div class="update-nag orangetable"> <div class="update-text"><i class="fa fa-lock" aria-hidden="true"></i> <b>Оранжевая</b> Табличка.</div> </div>


Синяя :

<div class="update-nag bluetable"> <div class="update-text"><i class="fa fa-table" aria-hidden="true"></i> Синяя табличка .</div> </div>


Зеленая :

<div class="update-nag greentable "> <div class="update-text"><i class="fa fa-font-awesome" aria-hidden="true"></i> Зеленая табличка. </div> </div>


Красная :

<div class="update-nag redtable"> <div class="update-text"> <b><i class="fa fa-exclamation-triangle" aria-hidden="true"></i> Важно!</b> Это красная табличка!</div> </div>


Белая:

<div class="update-nag whitetable"> <div class="update-text"> <i class="fa fa-window-restore" aria-hidden="true"></i> Простая белая табличка</div> </div>


На этом установка закончена.

На данный момент никто не оставил комментариев.

Оставить комментарий :


Требуется войти в свой аккаунт.

Для того чтобы оставить комментарий вам не обходимо войти в свой аккаунт или зарегистрироваться.

Вход Регистрация

Смотрите также :

Одностраничный шаблон Cardio для uCoz

Шаблон Cardio полностью адаптирован под мобильный устройства, выполнен в стилей clean design. Данный шаблон разработан под тематику фитнеса, но его...