css requires shadow effect_html/css_WEB-ITnose-HTML Tutorial-php.cn

css requires shadow effect_html/css_WEB-ITnose

WBOY

Release： 2016-06-24 11:42:10

Original

1309 people have browsed it

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;}

Copy after login

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

CSS3

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

Syntax

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

Copy after login

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) 改为内部阴影。	测试