Text gradient <h1>

Question

I have a h1 tag text. Is it possible to give this text a shadow using CSS? (preferable without JavaScript).

Any help?

I need a color gradient from: #486882 to #2b4356

Answer 1

Gradients and shadows are not the same:

Text-Shadow: https://developer.mozilla.org/en/CSS/text-shadow

Text Gradient: http://matthewleak.co.uk/css3bob/

Answer 2

It is possible but you have to master the cross browser compatibility. Here is nice sample

http://robertnyman.com/2010/02/15/css-gradients-for-all-web-browsers-without-using-images/

Hope this helps

Answer 3

There is no way to directly specify a gradient in css for text-shadow . However, you can use two text-shadow s together to get the effect you want:

h1 { text-shadow: 0 0 0.2em #2b4356, 0 0 0.1em #486882 }

Answer 4

Yup quite possible with CSS3.

text-shadow: XXpx XXpx 0px #2b4356;

DEMO