开发者

Programmatically produce a paper shadow

开发者 https://www.devze.com 2023-03-14 05:27 出处:网络
On this page, you\'ll notice a shadow on the left border. It\'s done with an image. Is it possible to produce sha开发者_如何学Godows like this entirely programmatically with CSS or anything else. You\

On this page, you'll notice a shadow on the left border. It's done with an image. Is it possible to produce sha开发者_如何学Godows like this entirely programmatically with CSS or anything else.


You're looking for the box-shadow property in CSS3.

The canonical syntax is:

#example1 {
box-shadow: 10px 10px 5px #888;
}

You can support in Mozilla and WebKit with the following syntax:

#example1 {
-moz-box-shadow: 10px 10px 5px #888;
-webkit-box-shadow: 10px 10px 5px #888;
box-shadow: 10px 10px 5px #888;
}

(These examples are from http://www.css3.info/preview/box-shadow/ )

You can get compatibility for this in Internet Explorer with CSS3 Pie


the box-shadow property available in css3 can help you solve this problem

for browser compatibility you can set it this way,

#div {
-moz-box-shadow: 2px 3px 3px #888;
-webkit-box-shadow: 10px 10px 5px #888;
box-shadow: 10px 10px 5px #888;
} 

the properties are

left right blur and color

0

精彩评论

暂无评论...
验证码 换一张
取 消