Как тени наложить

Как тени наложить

А Вы точно уверены, что Вам нужна тень? Или всё-таки равномерный полупрозрачный слой поверх всей картинки? Если слой, то с помощью box-shadow Вы такого эффекта не добьётесь — придётся использовать дополнительный элемент.

К сожалению, у img нет своих псевдоэлементов, поэтому как вариант — обернуть картинку в блок и уже с помощью его :after наложить плёнку на изображение:

.img-wrap {    float: left;    position: relative;  }  img {    max-width: 100%;    display: block;    margin: 0;  }  .img-wrap:after {    content: '';    display: block;    position: absolute;    width: 100%;    height: 100%;    background-color: rgba(0,0,0,.5);    top: 0;    left: 0;  }
<div class="img-wrap">  <img src="https://avatars.mds.yandex.net/get-pdb/225396/2dc17845-391c-4e56-b49e-a3559c245e97/s1200" alt="Как тени наложить" />  </div>



Источник: ru.stackoverflow.com


Добавить комментарий