css3背景及字体渐变
1.背景渐变:
.linear {
width: 100%;
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#b8c4cb,endColorStr=red); /*IE 6 7 8*/
background: -ms-linear-gradient(left, #F05E5E, #F9B03E); /* IE 10 */
background: -moz-linear-gradient(left,#F05E5E,#F9B03E); /*火狐*/
background: -webkit-gradient(linear, 100% 100%, 100% 100%,from(#F9B03E), to(#F05E5E)); /*谷歌*/
background: -webkit-gradient(linear, 100% 100%, 100% 100%, from(#F05E5E), to(#F9B03E)); /* Safari 4-5, Chrome 1-9*/
background: -webkit-linear-gradient(left, #F05E5E, #F9B03E); /*Safari5.1 Chrome 10+*/
background: -o-linear-gradient(left, #F05E5E, #F9B03E); /*Opera 11.10+*/
}
2.字体渐变:
.text-gradient {
color: #F05E5E;
background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(#F05E5E), to(#F9B03E));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
css3背景及字体渐变的更多相关文章
- CSS3——背景 文本 字体 链接 列表样式 表格
背景 background-color rgb(255,0,0,1) 最后一个值表示透明度,范围是 0--1 background-image 默认平铺重复显示 background-rep ...
- 从零开始学习前端开发 — 17、CSS3背景与渐变
一.css3背景切割: background-clip:border-box|padding-box|content-box; 作用: 用来设置背景的可见区域 a) border-box 默认值,背景 ...
- css3背景颜色渐变属性 兼容性测试基础环境为:windows系统;IE6.0+, Firefox4.0+, Chrome4.0+, Safari4.0+, Opera15.0+
css3背景颜色渐变属性 兼容性测试基础环境为:windows系统:IE6.0+, Firefox4.0+, Chrome4.0+, Safari4.0+, Opera15.0+ 语法: <li ...
- CSS3背景与渐变
一.CSS3 背景图像区域 background-clip(指定背景绘制区域) ackground-clip: border-box / padding-box / content-box; /*没有 ...
- css3背景颜色渐变属性
https://www.cnblogs.com/ningkyolei/p/4623697.html 很久之前写的一篇文章了,今天重新整理一下关于css3背景渐变的写法,至于是怎么来的,可以看下面渐变的 ...
- 第七十九,CSS3背景渐变效果
CSS3背景渐变效果 学习要点: 1.线性渐变 2.径向渐变 本章主要探讨HTML5中CSS3背景渐变功能,主要有两种渐变方式:线性渐变和径向 (放射性)渐变. 一.线性渐变 linear-gradi ...
- [转]真正了解CSS3背景下的@font face规则
本文转自:http://www.zhangxinxu.com/wordpress/2017/03/css3-font-face-src-local/ by zhangxinxu from http:/ ...
- CSS3背景 制作导航菜单综合练习题
CSS3背景 制作导航菜单综合练习题 小伙伴们,根据所学知识,使用CSS3实现下图的导航菜单效果 任务 1.制作导航圆角 提示:使用border-radius实现圆角 2.制作导航立体风格 提示:使用 ...
- CSS SANS – 神奇!使用 CSS3 创建的字体
在我们的认识中,CSS 所能做的就是改变网页的排版布局,调整字间距等.然而,这里我们要介绍的则是使用 CSS3 制作字体.CSS SANS 可以通过 CSS 技术创建的A-Z字体,一起来围观下. 在线 ...
随机推荐
- Dancing Links 模板
struct dl{ // x: line, y: column struct node{ int c, left, right, up, down; }; vector<node> a; ...
- Educational Codeforces Round 11——A. Co-prime Array(map+vector)
A. Co-prime Array time limit per test 1 second memory limit per test 256 megabytes input standard in ...
- 背包问题--golang的入门解
. 定义一种 表示静态属性的 关键字 / 修饰符 2. 作用共用.共享 能有此作用的原因分析: Java中,任何变量 / 代码存储时,都是 在编译时 由系统自动分配内存在静态变量编译后,所分配的内存会 ...
- UVA12206 Stammering Aliens 【SAM 或 二分 + hash】
题意 求一个串中出现至少m次的子串的最大长度,对于最大长度,求出最大的左端点 题解 本来想练哈希的,没忍住就写了一个SAM SAM拿来做就很裸了 只要检查每个节点的right集合大小是否不小于m,然后 ...
- 刷题总结:排序机械臂(石室中学oj)(splay)
题目: 题目描述 为了把工厂中高低不等的物品按从低到高排好序,工程师发明了一种排序机械臂.它遵循一个简单的排序规则,第一次操作找到最低的物品位置 P1,并把从左起第 1 个至第 P1 个之间的物品反序 ...
- bzoj3924 [Zjoi2015]幻想乡战略游戏 点分树,动态点分
[BZOJ3924][Zjoi2015]幻想乡战略游戏 Description 傲娇少女幽香正在玩一个非常有趣的战略类游戏,本来这个游戏的地图其实还不算太大,幽香还能管得过来,但是不知道为什么现在的网 ...
- java中static变量和方法的总结
转自:http://blog.csdn.net/haobo920/article/details/5921621 java中static变量和方法的总结 java中一切皆是对象 一个类中对象的定义一般 ...
- IPython:一种交互式计算和开发环境
一 键盘快捷键 - Ctrl-P 或上箭头键 后向搜索命令历史中以当前输入的文本开头的命令 - Ctrl-N 或下箭头键 前向搜索命令历史中以当前输入的文本开头的命令 - Ctrl-R ...
- 当axios需要传送application/x-www-form-urlencoded格式参数的问题
我发送出去的数据发现后台接收不到,查找了一下原因,发现需要form-data的数据后台才可以获取到.于是改成了form-data格式,成功了,后台获取到数据了,有点小激动,但是随即发现发送的数据格式出 ...
- 转 Python爬虫入门四之Urllib库的高级用法
静觅 » Python爬虫入门四之Urllib库的高级用法 1.设置Headers 有些网站不会同意程序直接用上面的方式进行访问,如果识别有问题,那么站点根本不会响应,所以为了完全模拟浏览器的工作,我 ...