box-shadow属性

box-shadow属性

作者:LAMP小白  点击:2138  发布日期:2012-09-19 23:50:00  返回列表

box-shadow有六个可设值: img{box-shadow:阴影类型 X轴位移 Y轴位移 阴影大小 阴影扩展 阴影颜色 }

•当不设阴影类型时,默认为投影效果。当设为inset时,为内阴影效果。

•X轴和Y轴位移类似于photoshop里面的”角度”和”位置。

•阴影大小、扩展、颜色和Photoshop里面的效果一样

例子

box-shadow:0 0 10px #123;

投影效果 X位移0 Y位移0 阴影大小10px 颜色#123

另外一个有趣的效果

img{box-shadow:-10px 0 10px red, box-shadow:10px 0 10px blue,box-shadow:0 -10px 10px yellow,box-shadow:0 10px 10px green}

这时这张图片的四周都会有不同的投影颜色



上一篇:CSS border-radius属性 下一篇:快递查询API
0