Page 80 - CSS

Chapter 8: box-shadow

Syntax

• box-shadow: none|h-shadow v-shadow blur spread color |inset|initial|inherit;

Parameters

Parameters Details

by default, the shadow is treated as a drop shadow. the inset keyword draws
inset
the shadow inside the frame/border.

offset-x the horizontal distance

offset-y the vertical distance

0 by default. value cannot be negative. the bigger the value, the bigger and
blur-radius
lighter the shadow becomes.

spread- 0 by default. positive values will cause the shadow to expand. negative values
radius will cause the shadow to shrink.

can be of various notations: a color keyword, hexadecimal, rgb(), rgba(),
color
hsl(), hsla()

Remarks

Browser Support:

• Chrome 10.0
• IE 9.0
• Firefox 4.0 3.5 -moz
• Safari 5.1 3.1 -webkit-
• Opera 10.5

Examples

drop shadow

JSFiddle: https://jsfiddle.net/UnsungHero97/80qod7aL/

HTML

https://riptutorial.com/ 58