Shadow text, for all browsers

Standard CSS 3 text fill attribute and alternative for older browsers.

The shading effect under text characters exists in Internet Explorer 5.5 as an ActiveX filter. It became widespread in all browsers, becoming the property of CSS 3.

Standard code

The text-shadow property is followed by a definition or a comma-separated list of definitions.

You can override the property with the definition: text-shadow: none.

Each definition consists of 4 parameters, two of which are optional.

• Color. Optional. The default is the text color of the element.
• Horizontal offset. This is the width of the shadow that extends to the right when the value is positive. A negative value places it on the left.
• Vertical offset. This is the height of the shadow down if positive, if not.
• Level of blur. Optional, the default value is 0. An integer greater than zero makes the shadow lighter.

Demo code:

.tshadow
{
  text-shadow: 1px 1px 2px black;
}

To surround characters with a halo effect:

.halo
{
  text-shadow: 1px 1px 2px black, 0 0 1em gray, 0 0 0.2em gray;
}

Example:

CSS code for all browsers

<style>
.tshadow
{ 
	text-shadow: 1px 1px 2px black;
}
.halo
{
	text-shadow: 1px 1px 2px black, 0 0 1em gray, 0 0 0.2em gray;
}
</style>

To access these properties in JavaScript...

object.style.textShadow="1px 2px 2px gray";