这是段渐变文本

.text{
font-size: 30px;
font-weight: bold;
background-image: linear-gradient(#ed3f27, #9b0999);
-webkit-background-clip: text;
color: transparent ;
}

这是段流光文本

.text2{
-webkit-text-fill-color: transparent;
background-image: -webkit-linear-gradient(left,#129835,#ece648 25%,#129835 50%,#F9E92B 75%,rgb(40, 150, 38));
background-size: 200%,100%;
-webkit-background-clip: text;
-webkit-animation: word 5s linear infinite ;
}
@keyframes word {
0%{background-position: 0 0}
100%{background-position: -100% 0}
}

参考:CSS3 text-fill-color简介及应用展示

css实现渐变字体和流光字体的更多相关文章

  1. css 文本外观属性(text) 和 字体样式属性(font)

    css文本 text外观属性 color: 颜色值(red,blue)十六进制 ,rgb letter-spacing: 字间距 px,em word-spacing: 单词间距 对中文无效 line ...

  2. 【CSS简介、基础选择器、字体属性、文本属性、引入方式】前端小抄(2) - Pink老师自学笔记

    [CSS简介.基础选择器.字体属性.文本属性.引入方式]前端小抄(2) 本学习笔记是个人对 Pink 老师课程的总结归纳,转载请注明出处! 一.CSS简介 CSS 的主要使用场景就是布局网页,美化页面 ...

  3. css语法规范、选择器、字体、文本

    css语法规范 使用 HTML 时需要遵从一定的规范,CSS 也是如此.要想熟练地使用 CSS 对网页进行修饰,首先需要了解CSS 样式规则. CSS 规则由两个主要的部分构成:选择器以及一条或多条声 ...

  4. CSS简介,基础选择器,字体属性,文本属性

    欢迎大家去博客冰山一树Sankey,浏览效果更好.直接右上角搜索该标题即可 博客园主页:博客园主页-冰山一树Sankey CSDN主页:CSDN主页-冰山一树Sankey 前端学习:学习地址:黑马程序 ...

  5. css整理-02 颜色和字体

    颜色 命名颜色 RGB指定颜色 数值: 0-255 百分比 三元组:红绿蓝 16进制RGB web安全颜色 在256色计算机系统上总能避免抖动的颜色 表示为rgb值20%和51的倍数 web安全色的简 ...

  6. HTML与CSS入门——第六章 使用字体

    知识点: 1.粗体.斜体和特殊文本格式的使用 2.字体的调整方法 3.特殊字符的使用方法 6.1 粗体.斜体和特殊文本格式: font-weight控制粗细 加粗<strong> font ...

  7. 如何制作prezi swf格式字体(prezi 中文字体)

    如何制作prezi swf格式字体(prezi 中文字体) 文/玄魂 前言 Prezi软件虽然没有正式进入中国,但是中国的Prezi爱好者却在不遗余力的推广着Prezi.我接触这款软件比较晚,但是从接 ...

  8. 修改字体篇:css3@font-face@字体转换@浏览器字体支持

    @font-face { font-family: 'MyWebFont'; src: url('webfont.eot'); /* IE9 Compat Modes */ src: url('web ...

  9. CentOS 7 安装字体库 & 中文字体

    前言 报表中发现有中文乱码和中文字体不整齐(重叠)的情况,首先考虑的就是操作系统是否有中文字体,在CentOS 7中发现输入命令查看字体列表是提示命令无效:  如上图可以看出,不仅没有中文字体,连字体 ...

随机推荐

  1. Okhttp解析—Okhttp概览

    Okhttp解析-Okhttp概览 Okhttp作为目前Android使用最为广泛的网络框架之一,我们有必要去深入了解一下,本文是Okhttp解析的第一篇,主要是从宏观上认识Okhttp整个架构是如何 ...

  2. 小小知识点(二十二)显示屏与主机之间连接,出现无信号字样时,应检查是否正确选择集显和独显VGA接口

    显示屏与主机之间连接,出现无信号字样时,应检查是否正确选择集显和独显VGA接口 通过VGA接口判断集成显卡和独立显卡.在台式机主机上,VGA接口竖着放置的说明是集成显卡,VGA接口横着放置的说明是独立 ...

  3. 移动web 1像素边框

    实现方法 border-image 图片 实现 这篇文章是腾讯github上的解决方案border-image来实现的 链接走起 <使用border-image实现类似iOS7的1px底边> ...

  4. 51nod 1086背包问题V2 (完全背包模板题)

    1086 背包问题 V2 1 秒 131,072 KB 20 分 3 级题 题目描述 有N种物品,每种物品的数量为C1,C2......Cn.从中任选若干件放在容量为W的背包里,每种物品的体积为W1, ...

  5. 除了闹过腥风血雨的fastjson,你还知道哪些Java解析JSON的利器?

    昨天下午 5 点 10 分左右,我解决掉了最后一个 bug,轻舒一口气,准备关机下班.可这个时候,老板朝我走来,脸上挂着神秘的微笑,我就知道他不怀好意.果不其然,他扔给了我一个新的需求,要我在 Jav ...

  6. 【python系统学习05】input函数——实现人机交互

    input函数 目录 input用途 语法 示例 参数 返回值 返回值数据类型转换 容错处理 动手吧 input用途 实现人机交互: 1.你提出问题打印在屏幕上, 2.运行程序的人再输入回答. 3.按 ...

  7. Activiti 手工任务(manualTask)

    Activiti 手工任务(manualTask) 作者:Jesai 前言: 手工任务就是一个自动执行的过程.手动任务几乎不在程序中做什么事情,只是在流程的历史中留下一点痕迹,表明流程是走过某些节点的 ...

  8. java常量 数据类型

    一.常量 概念:程序运行期间,内容不发生改变的量 1.字符串常量 双引号 2.整数常量 3.浮点数常量 4.字符常量 单引号 一个字符 必须要有一个字符 不能为空 5.布尔常量 true false ...

  9. MySql 常用时间函数

    1.date() 提取日期或日期时间表达式的日期部分 select date(create_time) from blog_article; 2.date_format() select date_f ...

  10. 8.JavaSE之变量、常量、作用域

    变量variable: 变量是什么:就是内存中开辟的可以变化的量! Java是一种强类型语言,每个变量都必须声明其类型. Java变量是程序中最基本的存储单元,其要素包括变量名,变量类型,作用域   ...