我有一个使用插入框阴影的容器。容器包含图像和文本。嵌入阴影显然不适用于图像：
这里的白色部分是容器。它包含一个白色图像，并且应用了嵌入框阴影。
body {
background-color: #000000;
}
main {
position: absolute;
bottom: 0;
right: 0;
width: 90%;
height: 90%;
background-color: #FFFFFF;
box-shadow: inset 3px 3px 10px 0 #000000;
}<main>
<img src="https://upload.wikimedia.org/wikipedia/commons/d/d2/Solid_white.png">
</main>有没有办法让内嵌框阴影与图像重叠？
只是为了插话，因为我只是在创建类似的东西......
我讨厌为了样式而用额外的元素污染我的标记，因此 CSS 解决方案是使用 :after 伪元素：
main::after {
box-shadow: inset 3px 3px 10px 0 #000000;
content: '';
display: block;
height: 100%;
position: absolute;
top: 0;
width: 100%;
}<main>
<img src="https://upload.wikimedia.org/wikipedia/commons/d/d2/Solid_white.png">
</main>对于您想要做的事情来说可能为时已晚，但在我看来这是更好的解决方案。