css3实现字体的颜色渐变

来源:互联网 发布:充电器检测软件 编辑:程序博客网 时间:2024/05/17 08:38

css3实现字体的颜色渐变,记录一下,在些页面时有时会用到。

效果图:


html源码:

<div class="mTitle_main"><h2>金玉良缘</h2></div>

css样式

<style type="text/css">
}
 .mTitle_main {

width: 500px;
height: 100px;

background:#000000 ; 

}


       .mTitle_main h2{   
width: 500px;
height: 100px;
margin: 0px 0px 0px 0px;
padding:0px 5px;
display: inline-block;
color: #fb7519;
font-size: 100px;
ont-family: ´微软雅黑´;
background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(rgba(234, 101, 10, 1)), to(rgba(246, 199, 156, 1)));//起作用关键的样式
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
</style>

结语:暂时,只有谷歌浏览器支持。

0 0
原创粉丝点击