HTML中的渐变文字效果

前端之家收集整理的这篇文章主要介绍了HTML中的渐变文字效果 前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

如何在不使用html中的图像的情况下在文本上显示渐变填充效果.

最佳答案
如果您希望文本本身具有渐变,可以使用http://nicewebtype.com/notes/2009/07/24/pure-css-text-gradient-no-pngs/处的CSS3解决.另一种替代方法是使用Javascript,尽管由于我对此不太了解,所以无法真正详细介绍.我确信许多Javascript框架(例如MooTools或jQuery)都具有相应的功能.如果他们没有,我相信您可以找到一个兼容的jQuery插件.

如果希望文本背景具有渐变,则可以使用CSS3:

/*
 Format: background: gradient(<type>,<point> [,<radius>]?,<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,也不可能在不久的将来支持CSS3,考虑到大多数Internet用户都在使用IE,这不是一个好的解决方案.

Javascript是一种可能,但是由于Java可能带来的安全风险以及早年获得的不良声誉,许多人已将Java关闭.

因此,图像是确保跨浏览器兼容性的唯一方法.糟透了,不是吗?

猜你在找的HTML相关文章