css requires shadow effect_html/css_WEB-ITnose

box-shadow: 0 0 10px 10px #b9bcbf;

CSS3 box-shadow property

CSS Reference Manual

Example

Add box-shadow to a div element:

div{box-shadow: 10px 10px 5px #888888;}

Try it yourself

More examples at the bottom of the page.

Browser support

IE Firefox Chrome Safari Opera

IE9, Firefox 4, Chrome, Opera and Safari 5.1.1 support the box-shadow attribute.

Definition and Usage

The box-shadow property adds one or more shadows to a box.

Tip: Use border-image-* properties to construct beautiful scalable buttons!

默认值： 继承性： 版本： JavaScript 语法：

none

no

CSS3

object.style.boxShadow="10px 10px 5px #888888"

Syntax

box-shadow: h-shadow v-shadow blur spread color inset;

Comments: box-shadow adds one or more shadows to a box. This property is a comma-separated list of shadows, each shadow specified by 2-4 length values, an optional color value, and the optional inset keyword. The value for omitted length is 0.

值 描述 测试

h-shadow	必需。水平阴影的位置。允许负值。	测试
v-shadow	必需。垂直阴影的位置。允许负值。	测试
blur	可选。模糊距离。	测试
spread	可选。阴影的尺寸。	测试
color	可选。阴影的颜色。请参阅 CSS 颜色值。	测试
inset	可选。将外部阴影 (outset) 改为内部阴影。	测试

Try it yourself - Example

Picture thrown on the table This example shows how to create a "Polaroid" picture and rotate the picture.

Related Pages

CSS3 Tutorial: CSS3 Border

CSS Reference Manual

I’m afraid I’ll forget. Just move here first.