[Помогите] Наложение прозрачного png на миниатюру

Тема в разделе "Wordpress", создана пользователем lite46, 4 ноя 2015.

Модераторы: DzSoft, Sorcus
  1. lite46

    lite46 Постоялец

    Регистр.:
    22 ноя 2011
    Сообщения:
    57
    Симпатии:
    20
    Всем доброго вечера. Подскажите, пожалуйста, как добавить ко всем миниатюрам наложение? Прозрачный PNG файл одного размера с миниатюрой.

    [​IMG]

    Только для миниатюр. Есть ли решение?
     
  2. joylord

    joylord Степной Волк

    Регистр.:
    27 дек 2012
    Сообщения:
    296
    Симпатии:
    151
    Дайте html кусок кода.
    можно следать через :after
    HTML:
    .attachment-post-thumbnail:after {
    position:absolute;
    content:'';
    background:url();
    width:200px;
    height:150px;
    top:0;
    left:0;
    }
    .attachment-post-thumbnail {
    position:relative;
    }
    
     
  3. lite46

    lite46 Постоялец

    Регистр.:
    22 ноя 2011
    Сообщения:
    57
    Симпатии:
    20
    код

    HTML:
    <div class="thumbnail">
    <div class="image-preview">
    <a href="/zapis-42.html">
    <img width="200" height="150" src="/wp-content/uploads/59621rm_19_365-200x150.jpg" class="attachment-post-thumbnail wp-post-image" alt="59621rm_19_365"></a>
    </div> 
    </div>
    миниатюра через стандартную функцию the_post_thumbnail()
     
  4. joylord

    joylord Степной Волк

    Регистр.:
    27 дек 2012
    Сообщения:
    296
    Симпатии:
    151
    выше мой код сss должен подойти.
    или
    HTML:
    .image-preview:after {
    position:absolute;
    content:'';
    background:#000;
    width:200px;
    height:150px;
    top:0;
    left:0;
    pointer-events:none;
    }
    .image-preview {
    position:relative;
    }
     
    Последнее редактирование: 4 ноя 2015
    lite46 нравится это.
  5. lite46

    lite46 Постоялец

    Регистр.:
    22 ноя 2011
    Сообщения:
    57
    Симпатии:
    20
    Спасибо! да, подошел второй вариант. Благодарю за помощь!