CSS Drop Shadows using text-shadow

No Comments
CSS Tutorials

The latest version of CSS allows you to add shadows to your text using the “text-shadow” property.

Here’s an example of what the output looks like in your browser:

I have a drop shadow of 0px X distance, 2px Y distance, 3px blur value, and a black color.

The text-shadow property takes four values, being the color code, the X offset (can be negative), the Y offset (can be negative) and the blur amount (higher values means more blurry). Here is what the code looks like:

p {
	text-shadow: #000000 0px 2px 3px;
}
  • Digg
  • Google Bookmarks
  • MySpace
  • Reddit
  • Facebook
  • NewsVine
  • StumbleUpon
  • Twitter
  • WordPress
  • Delicious
  • Yahoo Messenger
  • AIM
  • Bebo
  • Share/Bookmark

Related posts:

  1. Attractive HTML/CSS Gmail Signatures This will explain how to use attractive signatures in...
  2. Tabbed CSS Navigation This explains how to build a navigation which looks...

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>