1 min read
The CSS box-shadow property applies shadow to elements.
box-shadow
In its simplest use, you only specify the horizontal shadow and the vertical shadow:
div { box-shadow: 10px 10px; }
Next, add a color to the shadow:
div { box-shadow: 10px 10px grey; }
Next, add a blur effect to the shadow:
div { box-shadow: 10px 10px 5px grey; }
You can also use the box-shadow property to create paper-like cards:
The box-shadow property can be used to create paper-like cards:
January 1, 2016
Svkhbaatar square,Mongolia
div.card { width: 250px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); text-align: center; }
The following table lists the CSS shadow properties:
Powered by BetterDocs
You must be logged in to post a comment.