CSS3-字体渐变色
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Mauger`s Blog</title> <style type="text/css">
body {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: black;
} .color-a {
font-size: 48px;
color: #696969;
text-decoration: none;
background-image: -webkit-linear-gradient(92deg, #f35626, #feab3a);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
-webkit-animation: hue 60s infinite linear;
} @-webkit-keyframes hue {
from {
-webkit-filter: hue-rotate(0deg);
filter: hue-rotate(0deg);
}
to {
-webkit-filter: hue-rotate(360deg);
filter: hue-rotate(360deg);
}
} @keyframes hue {
from {
-webkit-filter: hue-rotate(0deg);
filter: hue-rotate(0deg);
}
to {
-webkit-filter: hue-rotate(360deg);
filter: hue-rotate(360deg);
}
}
</style>
</head>
<body>
<a href="https://maugerwu.github.io/" class="color-a">Welcome To Mauger`s Blog</a>
</body>
</html>
CSS3-字体渐变色的更多相关文章
- CSS3文字描边 CSS3字体外部描边
给需要实现文字描边的元素添加如下CSS3的属性 text-shadow:#000 1px 0 0,#000 0 1px 0,#000 -1px 0 0,#000 0 -1px 0; -webkit-t ...
- CSS3 字体
CSS3 @font-face 规则 在 CSS3 之前,web 设计师必须使用已在用户计算机上安装好的字体. 通过 CSS3,web 设计师可以使用他们喜欢的任意字体. 当您您找到或购买到希望使用的 ...
- 收集的可以下载css3字体图标的网站
http://icomoon.io/app/ 可以选择跟简单调整图标打包成css3 字体下载, http://www.flaticon.com/categories/weapons
- css3 字体、2D转换、3D转换
学习篇之CSS3 字体.2D转换.3D转换 一.字体 @font-face 将字体文件存放到 web 服务器上,通过CSS3 @font-face规则中定义,它会在需要时被自动下载到用户的计算机上. ...
- CSS3字体模块
介绍 字体提供了包含字符的视觉表现的资源.在最简单的等级中,其包含由字符编码到表示这些字符的形状(被称为字形)的映射信息.根据一组标准字体属性被分入一个字体家族的字体共享一个通用设计风格.在一个家族中 ...
- 绝对干货！！css3字体图标—丰富的阿里图标库iconfont的使用详解
在移动端Web项目开发中,我们往往需要用到一些小图标,比如搜索,返回,小菜单,小箭头等等..这如果还用切图你就OUT了.. 而这时CSS3提供的字体图标无疑是我们最好的选择,它就像字体一样,可以设置大 ...
- CSS3字体大小rem属性用法
PX为单位 在Web页面初期制作中,我们都是使用“px”来设置我们的文本,因为他比较精确和固定. 只要页面某元素设置了px字体大小,其子元素/子孙元素未设置字体大小或设置的字体大小css优先级没父元素 ...
- CSS3 外发光 渐变色
渐变色--线性渐变 linear-gradient #bg { width: 100%; background: -webkit-linear-gradient(#9f1c65, #d89068,#7 ...
- CSS3字体图标
网址:http://icomoon.io/http://iconfont.cn/ 阿里巴巴字体库 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1 ...
- css3字体
1.定义个性化字体 @font-face{ font-family:字体名字; src:字体地址,可以多写几个用逗号隔开兼容浏览器 } div{ font-family:字体名字/*使用字体*/ } ...
随机推荐
- win10和Ubuntu双系统安装过程中遇到的问题
1.安装过程 注意分区问题,很重要 https://blog.csdn.net/baobei0112/article/details/77996570 https://blog.csdn.net/s7 ...
- pyqt5-QWidget-窗口状态(最大化最小化等)
setWindowState(state) #设置窗口状态 Qt.WindowNoState 无状态-正常状态 Qt.WindowMinimized 最小化 Qt.Wind ...
- 集成JUnit测试错误java.lang.IllegalStateException: Failed to load ApplicationContext
1 详细错误信息 java.lang.IllegalStateException: Failed to load ApplicationContext at org.springframework.t ...
- react组件之间的组合方式
组合方式: 1/直接嵌套的方式 2/组件以变量的形式放置 3/可以通过props值,以变量的形式相当于作为参数传递父组件,然后进行组合 import React,{Component} from 'r ...
- Luogu P3700「CQOI2017」小Q的表格
为什么我连分块都想不到啊... 题意 定义一个矩阵$f$满足 $ f(a,b)=f(b,a)$ $ b·f(a,a+b)=(a+b)·f(a,b)$ 初始$ f(a,b)=ab$ 有$ m$次修改,每 ...
- Ant 与jemter的结合--批量执行jmeter脚本
一.Ant 介绍&作用: Apache Ant,是一个将软件编译.测试.部署等步骤联系在一起加以自动化的一个工具,大多用于Java环境中的软件开发. 作用:打包,部署,运行Java工程 二.下 ...
- Spring Cloud学习资料
博客 1.跟我学Spring Cloud 2.周立|Spring Cloud 3.Spring Cloud基础教程(强烈推荐) 4.Spring Cloud系列文章 5.forezp|史上最简单的 S ...
- printf是在libc库中么？
libc中果然有很多的函数,使用nm看了一下,里面竟然还有reboot函数,汗! 使用grep,可以看到各种 printf 也都在这里头. objdump是看函数的地址与函数名对应的,虽然也能证明pr ...
- 关于 tp5.0 阿里云 oss 上传文件操作
tp5.0 结合阿里云oss 上传文件 1.引入 oss 的空间( composer install 跑下第三方拓展包及核心代码包) 备注:本地测试无误,放到线上有问题 应该是移动后的路劲(相对于服 ...
- android listView功能简介
本文参考连接:http://blog.csdn.net/kesenhoo/article/details/7196920 android中listView是非常常用的组建,下边就经常用到的功能做一下简 ...