<div class="circle">
<img src=""></img>
</div>
Как создать внутреннюю тень у блока в форме круга (border-radius: 50%), так, чтобы она накладывалась на внутренний элемент - картинку.
Пробовал использовать z-index,- не вышло.
Stack Overflow на русском — это сайт вопросов и ответов для программистов. Присоединяйтесь! Регистрация займёт не больше минуты.
Присоединиться к сообществу<div class="circle">
<img src=""></img>
</div>
Как создать внутреннюю тень у блока в форме круга (border-radius: 50%), так, чтобы она накладывалась на внутренний элемент - картинку.
Пробовал использовать z-index,- не вышло.
Вот:
img {
z-index: -1;
position: relative;
width: 100%;
height: 100%;
}
div {
box-shadow: 0 0 20px red inset;
border-radius: 100%;
width: 100px;
height: 100px;
overflow: hidden;
}
<div>
<img src="https://www.burgeon.co.uk/content/images/thumbs/0000241_artificial-flowers-hat-box_600.jpeg"></img>
</div>