html - 我正在尝试为我的图像提供 "box-shadow"，但我不工作

Question

你能告诉我我的代码有什么问题吗？为什么图像上没有阴影？
这是我的代码:
HTML

<div class="wrapper">
    <img src="http://i.imgur.com/aVt9qPi.png"/>
</div> 

CSS

div.wrapper img{
-moz-box-shadow:inset 1px 2px 18px #000000;
-webkit-box-shadow:inset 1px 2px 18px #000000;
box-shadow:inset 1px 2px 18px #000000;
}

你可以找到工作演示 here

Answer 1

您不能直接在图像上应用阴影 inset 效果。最好将它应用到 div 上。

检查 DEMO .

div.wrapper{
-moz-box-shadow:inset 1px 2px 18px #000000;
-webkit-box-shadow:inset 1px 2px 18px #000000;
box-shadow:inset 1px 2px 18px #000000;
}

div.wrapper img{
  position:relative;
  z-index:-1;
}