Как затемнить в шаблоне часть фотографии, как у Яндекс Дзен?

  • Решено zarraa

    (@zarraa)


    7 лет назад

    Друзья, подскажите, возможно ли на моем сайте http://newrigaonline.ru/ затемнить часть фотографий под заголовками статей, как сделано в Яндекс Дзене или на сайте журнала «Профиль» — https://profile.ru/.

    Заранее Спасибо!!

    Страница, с которой нужна помощь: [войдите, чтобы увидеть ссылку]

Просмотр 9 ответов — с 1 по 9 (всего 9)
  • tuxfighter

    (@tuxfighter)

    7 лет назад

    Возможно все.
    Это зависит от вашего желания и навыков.

    Автор zarraa

    (@zarraa)

    7 лет назад

    Желание есть! Пытаюсь сформировать навык. Поэтому и спрашиваю.

    Автор zarraa

    (@zarraa)

    7 лет назад

    может это совсем несложно…

    tuxfighter

    (@tuxfighter)

    7 лет назад

    не сложно. справиться практически любой растровый редактор

    Автор zarraa

    (@zarraa)

    7 лет назад

    @tuxfighter, в шаблон можно какую-то утилиту внедрить или настроить, чтобы так делали или каждую фотографию отдельно обрабатывать?

    tuxfighter

    (@tuxfighter)

    7 лет назад

    на дзене каждое фото обработано отдельно.

    Автор zarraa

    (@zarraa)

    7 лет назад

    но это же автоматически делается. Вставляешь фото к тексту, а дзен сам его затемняет под заголовком

    Модератор Yui

    (@fierevere)

    永子

    7 лет назад

    HTML

    <div class="cvc darkened" >
 <img src="/images/blob.jpg" alt=""> 
</div>

    CSS

    
.darkened {
  position: relative;
}
 
.darkened::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5);  
  z-index: 1;
}
    Автор zarraa

    (@zarraa)

    7 лет назад

    Спасибо, @fierevere!! А в какое место в CSS это вставить?

Просмотр 9 ответов — с 1 по 9 (всего 9)

Тема «Как затемнить в шаблоне часть фотографии, как у Яндекс Дзен?» закрыта для новых ответов.

  • Форум: Плагины
  • 9 ответов
  • 3 участника
  • Последний ответ: zarraa
  • Последняя активность: 7 лет назад
  • Статус: решённая