HTML text gradient effect

Question

How to display gradient fill effects on text without using an image in html.

Answer 1

If you want the text itself to have a gradient, there is a workaround using CSS3 at http://nicewebtype.com/notes/2009/07/24/pure-css-text-gradient-no-pngs/ . Another alternative is to use Javascript, although it cannot go into details, since I know little about it. I am sure that many Javascript Framework, such as MooTools or jQuery, have functionality for this. If they don’t, I’m sure you can find the jQuery plugin that did.

, , CSS3:

/*
 Format: background: gradient(<type>, <point> [, <radius>]?, <point> [, <radius>]? [, <stop>]*);
 Use -mozilla-gradient or -webkit-gradient as these are the only browsers that support it (that I know of).
 For example, an aqua coloured gradient in a Webkit browser:
*/

.text {
 -webkit-gradient(linear, 0% 0%, 0% 90%, from(rgba(28, 91, 155, 0.8)), to(rgba(108, 191, 255, .9)));

}

Internet Explorer CSS3, , , - IE, .

Javascript - , Javascript , , , .

- . , ?

Answer 2

(png, gif jpg) WDC- SVG ( ). , Firefox 3+ Opera 9+, Adobe SVG Viewer IE6-8.

Inkscape

SVG wikipedia.org. SVG