.text-gradient {
display: inline-block;
color: green;
font-size: 10em;
font-family: ´微软雅黑´;
background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(rgba(0, 128, 0, 1)), to(rgba(51, 51, 51, 1)));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
};

由于目前text-fill-color属性貌似就webkit核心的浏览器支持,所以两个demo页面只能在Chrome浏览器或是Safari浏览器下才能看到渐变效果。Firefox浏览器下纯色,IE下就更不用说了。

css—文字渐变色的更多相关文章

  1. 奇思妙想 CSS 文字动画

    之前有些过两篇关于字体的文章,是关于如何定义字体的: 你该知道的字体 font-family Web 字体 font-family 再探秘 本文将会和这篇 -- CSS 奇思妙想边框动画类似,讲一些文 ...

  2. css文字两端对齐

    css文字两端对齐 text-align:Justify(火狐); text-justify:inter-ideograph(IE) text-justify(IE) 基本语法 text-justif ...

  3. html,CSS文字大小单位px、em、pt的关系换算

    html,CSS文字大小单位px.em.pt的关系换算 这里引用的是Jorux的“95%的中国网站需要重写CSS”的文章,题目有点吓人,但是确实是现在国内网页制作方面的一些缺陷.我一直也搞不清楚px与 ...

  4. CSS实现文字竖排 DIV CSS文字垂直竖列排版显示如何实现?

    DIV CSS实现文字竖排排版显示兼容各大浏览器,让文字垂直竖列排版布局. 有时我们需要一段文字进行从上到下竖列排版,我们知道CSS样式中有一样式可以让其竖列排版,但所有浏览器不全兼容,逼不得已放弃. ...

  5. <转载>使CSS文字图片div元素居中方法之水平居中的几个方法

    文字居中,文字垂直居中水平居中,图片居中,图片水平居中垂直居中,块元素垂直居中?当我们在做前端开发是时候关于css居中的问题是很常见的.情 况有很多种,不同的情况又有不同的解决方式.水平居中的方式解决 ...

  6. CSS文字垂直居中的一些问题

    说到CSS文字垂直居中,很多初学者都喜欢用调整行高等于div高度的方式来达到效果, div { height:30px; line-height:30px; } 但其实这么做会遇到一个问题:多行文本溢 ...

  7. CSS文字过多显示省略号

    CSS文字过多显示省略号 /*-webkit-line-clamp用来限制在一个块元素显示的文本的行数*/ .dot1{ width: 100%; display: -webkit-box; -web ...

  8. CSS文字大小单位px、em、pt详解

    这里引用的是Jorux的“95%的中国网站需要重写CSS”的文章,题目有点吓人,但是确实是现在国内网页制作方面的一些缺陷.我一直也搞不清楚px与em之间的关系和特点,看过以后确实收获很大.平时都是用p ...

  9. css文字超出自动显示省略号

    只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...

随机推荐

  1. html表单练习(讲义中的方法)

    用table作框体固定位置结构 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "ht ...

  2. js中writeln()方法

    writeln( ) 方法与 write( ) 方法几乎一样,差别仅在于是前者将在所提供的任何字符串后添加一个换行符.在 HTML 中,这通常只会在后面产生一个空格:不过如果使用了 <PRE&g ...

  3. Python实现8中常用排序算法

    L = [2,6,4,7,9,1,3,5,8] # 1.插入排序 def insert_sort(List): n = len(List) for i in range(1,n): # 得到索引 j ...

  4. vue采坑一:全局API

    Vue.set Vue.set( target, key, value ),target不能是 Vue 实例,或者 Vue 实例的根数据对象,因为源码中做了如下判断: var ob = (target ...

  5. Spring Boot-定义拦截器(七)

    在web项目 我们常常使用拦截器做权限验证和登陆验证 1.创建一个拦截器实现类 标注@Componet @Component public class LoginInterceputer implem ...

  6. 网上有一种错误的做法是:因为每一个双连通分量内的点low[]值都是相同的,则dfs()时,对于一条边(u,v),只需low[u]=min(low[u],low[v]),这样就不用缩点,最后求度数的时候

  7. Wireshark中的一些SNMP相关的过滤器

    Wireshark中的一些SNMP相关的过滤器 转自 http://linmingren2003.blog.163.com/blog/static/567510032011419825097/   由 ...

  8. Linux 3.14 待机流程分析

    1:待机节点创建 static int __init pm_init(void) { int error = pm_start_workqueue(); if (error) return error ...

  9. 自己定义控件三部曲之动画篇(七)——ObjectAnimator基本使用

    前言: 假如生活欺骗了你, 不要悲伤,不要心急! 忧郁的日子里须要镇静: 相信吧,快乐的日子终将会来临! 心儿永远向往着未来: 如今却常是忧郁. 一切都是瞬息,一切都将会过去: 而那过去了的,就会成为 ...

  10. jQuery实现轮播效果(一) - 基础

    前戏: XXXX年XX月XX日,经理交给我一个站点新闻资讯网页开发的活儿.我一个java程序猿,怎么完毕得了网页设计这样高端的活儿呢! 之前尽管有学过一点HTML.CSS的知识.可是在实际的使用中,把 ...