PDG & Associates – Paul D. Gurney – Web Architect What's new in web design and development

17Feb/120

CSS 3 – Box Shadow properties

The box-shadow property in CSS3 allows a comma-separated list of shadow attribute values.

These specify, in order, the horizontal offset, vertical offset, optional blur distance and optional spread distance of the shadow);

Then,  an optional color value and an optional ‘inset‘ keyword.

Inset lets you create an inner shadow, rather than the default outer shadow.

Examples:

  box-shadow: 5px 5px;
  box-shadow: 5px 5px 15px #888;
  box-shadow: inset 2px 2px 2px 2px black;
  box-shadow: 5px 5px #666, -12px -12px #f4f4f4, 0px 0px 15px 15px #cc6600;

These are supported in newer browsers.

Posted by Paul Gurney

Comments (0) Trackbacks (0)

No comments yet.


Leave a comment

(required)

No trackbacks yet.