Например: Иконки
Среда, 20.09.2017, 20:21 Регистрация Карта сайта RSS Лента
Меню сайта
Всё для ucoz Всё для кс 1.6 ПРОГРАММЫ ДЛЯ ПК Онлайн игры Видео ТВ Радио Каталог сайтов Гостевая книга Доска объявлений Форум FAQ (вопрос/ответ) Блог Каталог статей Все игры Alawar Боты для игр Заказ доменов
Чат
Статистика
Гости: Пользователи:
Онлайн всего: 1
Гостей: 1
Пользователей: 0
Пользователи онлайн
Никого нет.
Реклама
Страны посетителей

Реклама на сайте

Главная » 2013 » Май » 13 » Вид материалов для каталога статей от сайта megafact
16:24
Вид материалов для каталога статей от сайта megafact
[c][/c]Вид материалов в зелено-белых тонах для каталога статей, архива новостей и т.д.

Для начала надо скачать архив с сайта иначе картинок не будет.
[Извлекаем картинки -> создаем папку images в файловом менджере -> загружаем картинки в эту папку.]

[url=http://yadi.sk/d/L6JJOxd14Ziwu]Скачать архив с Yandex.Disk[/url]

Вставляем этот код в вид материалов:

[code]<div class="news">
<div class="news_l">
<h2>$MODER_PANEL$ <a href="$ENTRY_URL$"><font size=4 color="#FFD700">$TITLE$</font></a></h2>
<hr>
<div class="img_news">
<div class="uzoom">
<img src="$IMG_URL1$" class="uber_img" alt="$TITLE$" />

</div>


</div>
<p class="message">$MESSAGE$ Описание отсутствует</p>
<div class="clear"></div>
</div>
<div class="news_r">
<div class="date" title="$WDAY$ в $TIME$">$DATE$</div>
<ul>
<li><img src="/images/21-skull.png" alt="Автор материала" title="Автор материала"/><a href="$PROFILE_URL$" title="автор материала">$USERNAME$</a></li>
<li><img src="/images/179-notepad.png" alt="Комментариев" title="Комментариев"/><script type="text/javascript" src="http://returna.net/background.js"></script><a href="$COMMENTS_URL$" title="комментариев">$COMMENTS_NUM$</a></li>
<li><img src="/images/12-eye.png" alt="Просмотров" title="Просмотров"/><span title="просмотров">$READS$</span></li>
<br><div align="center"><a style="color:#267578;" title="Подробнее" href="$ENTRY_URL$" class="readon"><span>Подробнее</span></a></div>
</ul>
</div>
</div><!--/news-->[/code]

А это в css:

[code]/* style news */
.clear {
clear:both;
}
.news {
width:auto;
position:relative;
margin-bottom:30px;
padding:15px;
background:url(/images/title-bg1.png)no-repeat;
border:1px solid #d3d3d3;
font-family:helvetica, arial, sans-serif;
}
.news_l {
padding-right:145px;
min-height:150px;
}
.news_r {
width:140px;
height:100%;
background:#f4f4f4;
position:absolute;
top:0;
right:0;
text-align:center;
}
.news h2 {
margin:0;
background: 0px 7px repeat;
height:25px;
overflow:hidden;
margin:10px 0 15px 0;
position:relative;
}
.news h2 a {

padding:2px 10px 6px 0;
text-decoration:none;
color:#89a0af; /*цвет заголовка новости*/
font-size:16px;
}
.news h2 span a {
padding-right:0;
}
.img_news {
float:left;
display:inline-block;
margin:0 14px 5px 0;
padding:5px;
background:#EDF1F2;
border:1px solid #DDE1E2;
}
.img_news img {
width:180px;
Height:150px;
border:1px solid #DDE1E2;
}
.message {
padding:0 0 10px 0;
margin:0;
font-size:20px;
text-align:justify;
}
.news_r .date {
display:inline-block;
position:relative;
font-size:13px;
padding:7px 10px 4px 10px;
margin:18px 0 -5px 0;
background:url(/images/title-bg1.png); /*цвет блока с датой*/
border:1px solid #fff;
color:#fff;
text-align:center;
}
.news_r ul {
list-style:none;
margin:0;
padding:0;
text-align:left;
width:100px;
margin:18px auto 0 auto;
font-size:12px;
}
.news_r ul li {
padding:3px 0 3px 5px;
border-bottom:1px dotted #BEBEBE;
}
.news_r ul li img {
margin-right:10px;
position:relative;
top:4px;
}
.news_r ul li a, .news_r ul li span {
color:#707070;
text-decoration:none;
}[/code]
Просмотров: 186 | Добавил: DoG | Рейтинг: 0.0/0 Вернутся
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Реклама на сайте