属性如下:
box-shadow:阴影类型 X轴位移 Y轴位移 阴影大小 阴影扩展 阴影颜色
网上关于这个的教程很多,随便搜搜都有,不过看过之后最好实践一下,我这里就不说教程了,贴张图看看:
提醒一下的是不能直接对图片使用inset(内阴影)效果,昨晚我在这里纠结了好久好久。
然后放上个Demo(IE就不用尝试了,嗯,有IE 9的可以看看如何。如果看到乱码,在浏览器中将编码改为utf8即可)。
最后是一点参考资料:
- CSS3属性box-shadow使用教程(关于多重阴影部分有误,正确用法可参考我的Demo)
- The ‘box-shadow’ property
表示点demo进去看到的文字是乱码。
@Jasoon, 沒有亂碼,chrome表示蛋定。
@Jasoon, 用的是IE?将编码换为utf8即可
@流年, 火狐中文版表示转换成UTF8有效,不再乱码。
一般的box-shadow我都只會用box-shadow: X X X #000,X X X #000,X X X #000 那效果挺舒服的
@小闇, 黑色?
@流年, 只是個舉例~
@小闇, 明白,你喜欢用多重阴影的
咦,今天还蛮靠前排的嘛。。嘿嘿。流年~~球球来啦 😆
@球球, 牛牛呢?
@流年, 牛牛在火车上,明天就能来看你啦~~
@球球, 我还以为今天就回来啦
@流年, 嘿嘿,奶牛驾到
@奶牛, 😉 😉
主题果然整的越来越pp了 😉
@vastar, pp原来是漂亮的意思啊
这个我真的不会
@su, 这个可以不懂啊
@Code之行人, 的确可以不懂
我有一个主题用了这个效果
@zwwooooo, 早起的鸟儿
不会整css,先看看
@winy, 你博客整的很好看的说
@流年, 那是,我copy很在行
@winy, ➡
我咋看不懂呢
@扯远了, 🙂 可以不用看懂,没事折腾而已
@流年, 还是那句话,这两天我都被试验搞得没心情更新了
@扯远了, 那就专心做实验吧
你可以无视我了
@毕业生, ??
乱码唉 ❓
@yetone, 编码问题,在浏览器中改为utf8即可
CSS,唉。又是代码,又见代码,头疼啊。。咖啡因友情路过,欢迎回访。
@咖啡因, 文中其实没什么代码
又爱又恨啊这东西
@Ygs, 慢慢折腾吧
其实你可以选择在那个demo里写个
meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ /
@mice, 汗!忘记这东西了!话说,一开始没发现对你的上一条评论很是疑惑,原来还接着下文
尽量用英文做标题嘛! 😳
@Mucid, 这篇除非加文字,否则我还真不知道怎么用中文(翻译过来? ➡
@流年, 我是说你的演示页面最好用英文,免去乱码烦恼^_^
@Mucid, 汗,也没必要。忘记加编码声明了
对这个没有过多的研究
哦 原来是这样的
我的空间图片使用highslide效果 😡
@学夫子, 我以前想加上一个图片效果,单独成功,博客失败,所以暂时先不折腾它
怎一个漂亮了得,围观小居研究院。
这个现在基本上都在用呢~~
@N, 我倒是刚开始学
外观和效率上box-shadow在一些方面做的不错,不过我擦着背景为什么那么谷歌啊
@7cbt, 什么背景?
@流年, 那张图片背后的红 黄 蓝 绿 很谷歌
@7cbt, 原来如此
看起来不错!!
路过
😛 初次来访 以后会常来的
CSS咱学的太浅了
这些新属性更是刚听说 汗~~
@Pavel, 我也是学得很浅
😎 最近也在研究CSS3……吼吼~