bar-reaktor.ru

"Помощь в развитии Сайта"     "Торрент- трекер от Наших сайтов"     "Архив сайта"

Выбрать дизайн:
  • Страница 1 из 1
  • 1
Модератор форума: XemorDio  
Форум » Для вебмастеров » Графика для сайта » Скрипты сталкер для Ucoz » Таблицы с информацией [CSS]
Таблицы с информацией [CSS]
XemorDio Дата: Сб, 18.02.2017, 06:20:07 | Сообщение # 1

В Зоне Реактора с 25.09.2013
Сообщений: 181
Заслуги в Зоне Реактора
За 100 Сообщений


Довольно интересно улучшение для сайта, а именно таблички с информацией, которые будут информировать пользователя о том, что при копирование материала нужно указать обратную ссылку на сайт, или ещё какую-то интересующую информацию, которая заинтересует пользователя. Данные таблицы можно сделать: оранжевыми, синими, зелёными, красными, белыми.

Приступаем к установке:

Нужно стили на них поставить в 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; }


Ставим там где вы считаете нужным их появление.

Оранжевая

Код
<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> Информационные таблички от <b>zornet.ru</b> .</div> </div>


Зеленая

Код
<div class="update-nag greentable "> <div class="update-text"><i class="fa fa-font-awesome" aria-hidden="true"></i> С использованием шрифта <b>FontAwesome</b>. </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>


PS - перед каждым описанием будет стоять оригинальная кнопка, которую вы сможете сменить, как все сделать, вас ссылка дана в самой статье.

Источник: uon.ucoz.com



 
Форум » Для вебмастеров » Графика для сайта » Скрипты сталкер для Ucoz » Таблицы с информацией [CSS]
  • Страница 1 из 1
  • 1
Поиск:

Сегодня в Баре - Реактор

Легенда условных обозначений : Призрак, Администратор, Модератор, Проводник, Сталкеры, Чистое небо, Тёмные, Свобода, Наёмники, Нейтралы, Военные, Долг, Монолит, Заблокированные .


Последние сообщения:

Чат

Активисты Форума:

Нужные темы:


Если вы ищете место где можно перекусить и отдохнуть, место, где можно хорошо выпить и поговорить, место, где вам всегда подскажут как подзаработать - подходите в БАР - РЕАКТОР! Мы всегда рады новым посетителям!
CMIT               (03.04.2016)
LENA_D               (11.10.2010)
kapa               (09.01.2014)
ULTRA               (04.09.2015)
Dimon02022               (08.11.2011)
garwas               (12.11.2011)
Strelok               (01.11.2014)
Чик@нчик               (15.04.2014)
Гвоздь               (03.11.2017)

Пришедшие в Бар:


Каха               (15.11.2018)
MGDN               (15.11.2018)
garwas0425               (14.11.2018)
Наседов               (14.11.2018)
PsуDOG               (13.11.2018)
ЯБродяга               (11.11.2018)
Яндекс.Метрика