New! My 44-page ebook "CSS in 44 minutes" is out! 😃
#box-shadow
Defines the shadow of the element.
default
box-shadow: none;
Removes any box-shadow that was applied to the element.
box-shadow: 2px 6px;
You need at least two values:
- the first is the horizontal offset
- the second is the vertical offset
The shadow color will be inherited from the text color.
box-shadow: 2px 6px red;
You can define a color as the last value.
As with color
, you can use color names, hexadecimal, rgb, hsl...
box-shadow: 2px 4px 10px red;
The optional third value defines the blur of the shadow.
The color will be diffused across 10px in this example, from opaque to transparent.
box-shadow: 2px 4px 10px 4px red;
The optional fourth value defines the spread of the shadow.
The spread defines how much the shadow should grow: it enhances the shadow.