Я использую шаблон Sight. Там можно выбрать 2 типа просмотра постов – список и грид (таблица что ли ).
Так вот, я сделал чтобы выводился только грид. И там есть особенность – когда заходишь в рубрику или просто на главную, у каждого поста видно только его миниатюру, но если наводишь то миниатюра исчезает, а вместе нее показывается название поста и анонс.
А как же сделать, чтобы не нужно было наводить. А сразу поверх миниатюры выводился название поста и анонс?
Код лупа, используемого для грида
<div id="post_">
<a href="" class="thumb">
<a href="">
Код CSS
.grid {padding: 1px 1px 1px 1px;}
.grid .post {width: 286px; height: 286px; background-color: #f5f5f5; padding: 18px; float: left; position: relative; overflow: hidden; cursor: pointer;margin: 1px 1px 1px 1px; }
.grid .post .post-category, .grid .post .post-content, .grid .post .post-meta em {display: none;}
.grid .post h2, .grid .post .post-meta { display: block; margin: 0 0 80px 0;}
.grid .post .thumb {width: 280px; height: 280px; top: 0; left: 0; z-index: 1;position: absolute;}
.grid .post .thumb img {width: 322px; height: 322px;}
.grid .post h2, .grid .post h2 a {color: #000; font-size: 16px; font-weight: normal; text-decoration: none; }
.grid .post h2 {margin-bottom: 5px;}
.grid .post a {text-decoration: none;}
.grid .post a:hover {text-decoration: underline;}
.grid .post .post-meta {font-size: 14px; color: #656363;}
.grid {color: #262626; font: 14px/1.5 Helvetica, Arial, sans-serif;}
Способы, используемые в инете, мне не помогли, Или же я не правильно сделал.
Оставить комментарий