插图阴影效果

如何使这个内部阴影效果与CSS？插图阴影效果

到目前为止，我得到这个http://jsfiddle.net/yX26J/。如何仅将阴影应用于左侧和顶部？

2010-10-17 Jeaf Gilbert

这似乎为Chrome浏览器：'-webkit-箱阴影：插图-1em -1em 2em的＃111;'看起来李尽管如此。 :) – bzlm 2010-10-17 10:40:18

您可以更改与胶印的阴影：

它在所有的浏览器的所有最新版本支持的box-shadow支持

div { 
    width:80px; height:110px; 
    background:#3183bd; 
    -moz-box-shadow: inset 1em 1em 1em -1em #111; 
    -webkit-box-shadow: inset 1em 1em 1em -1em #111; 
    box-shadow: inset 1em 1em 1em -1em #111; 
}

http://jsfiddle.net/ga6cy/4/

来源

2010-10-17 10:57:43

谢谢文森特，那正是我要找的:) – 2010-10-17 12:57:06

我在CSS中寻找带阴影效果的剪切/插图时发现此页。从上到下没有左或右。所以谢谢@Vincent，你的回答帮助我通过一些小的调整来实现我的目标：http://jsfiddle.net/ga6cy/93/ – 2013-05-13 16:10:17

-2

我前几天也遇到过这个问题。

我很确定它不可能定义'顶部''左''底''正确'这是一个耻辱。

来源

2010-10-17 10:39:18 Daryl

关键是使用插入。

div.box { 
    box-shadow: inset 10px 10px 10px #000000; 
    -moz-box-shadow: inset 10px 10px 10px #000000; 
    -webkit-box-shadow: inset 10px 10px 10px #000000; 
}

本页面列举了浏览器支持： https://developer.mozilla.org/en/CSS/-moz-box-shadow

来源

2010-10-17 10:51:56

我不明白你为什么投下这个答案了？ – 2010-12-07 07:32:25

插图阴影效果

回答

相关问题