box

英[bɒks] 美[bɑ:ks]

n.Box; box-like object; box; sentry room

vt. Put... into a box [box, box]

vt.& vi.Boxing

Third person singular: boxes Plural: boxes Present participle: boxing Past tense: boxed Past participle: boxed

shadow

英[ˈʃædəʊ] 美[ˈʃædoʊ]

n.Shadow; shadow; ghost; ghost; hiding place

vt.Cast a shadow on; make hazy; track, trail; foreshadow

vi. Gradient; gloomy

adj. Shadow; shadow cabinet; informal

Third person singular: shadows Plural: shadows Present participle: shadowing Past tense: shadowed Past participle: shadowed

css box-shadow property syntax

Function:Add one or more shadows to the box.

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

Instructions: h-shadow required . The position of the horizontal shadow. Negative values ​​are allowed. v-shadow is required. The position of the vertical shadow. Negative values ​​are allowed. blur is optional. Fuzzy distance. spread is optional. The size of the shadow. color is optional. The color of the shadow. See CSS color values. inset is optional. Change the outer shadow (outset) to an inner shadow.

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

css box-shadow property example

<!DOCTYPE html>
<html>
<head>
<style> 
div
{
width:300px;
height:100px;
background-color:#ff9900;
-moz-box-shadow: 10px 10px 5px #888888; /* 老的 Firefox */
box-shadow: 10px 10px 5px #888888;
}
</style>
</head>
<body>

<div></div>

</body>
</html>

Run instance »

Click the "Run instance" button to view the online instance