背景渐变

background: -moz-linear-gradient( top,#f24652,#da2c3c);

background: -o-linear-gradient(top,#f24652,#da2c3c);

background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f24652),to(#da2c3c));

或

background: -webkit-linear-gradient(left, #f8ca99,#c28c6a);

文字渐变

background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(#fe7579), to(#e93849));

-webkit-background-clip: text;

-webkit-text-fill-color: transparent;

background-image: -moz-linear-gradient( top,#fe7579,#e93849);

-moz-background-clip: text;

-moz-text-fill-color: transparent;

background-image: -o-linear-gradient( top,#fe7579,#e93849);

-o-background-clip: text;

-o-text-fill-color: transparent;

background-image: -ms-gradient(linear, 0 0, 0 bottom, from(#fe7579), to(#e93849));

-ms-background-clip: text;

-ms-text-fill-color: transparent;

CSS3渐变相关的更多相关文章

  1. 再说CSS3渐变——线性渐变

    渐变背景一直以来在Web页面中都是一种常见的视觉元素.但一直以来,Web设计师都是通过图形软件设计这些渐变效果,然后以图片形式或者背景图片的形式运用到页面中.Web页面上实现的效果,仅从页面的视觉效果 ...

  2. CSS3渐变——径向渐变

    上节在<再说CSS3渐变——线性渐变>和大家一起学习了CSS3 Gradient中径向渐变最新语法(称得上是W3C的标准语法)相关知识以及其基本使用.今天我们在这一篇中主要和大家一起来了解 ...

  3. CSS3渐变——线性渐变

    渐变背景一直以来在Web页面中都是一种常见的视觉元素.但一直以来,Web设计师都是通过图形软件设计这些渐变效果,然后以图片形式或者背景图片的形式运用到页面中.Web页面上实现的效果,仅从页面的视觉效果 ...

  4. CSS3 Backgrounds相关介绍

    CSS3 Backgrounds相关介绍 1.背景图片(background images)是在padding-box的左上角落脚安家的,我们可以使用background-position属性改变默认 ...

  5. css3渐变(Gradients)

    <html> http://www.runoob.com/css3/css3-gradients.html CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳的 ...

  6. 25个CSS3 渐变和动画效果教程

    随着最新版CSS3渐变和动画功能发布,Web开发者在开发的过程中有了更多的选择.实际上,已经有了一些替代的技术,目的都是使网站的建设变得简易,高效和快速.不过CSS3所提供的渐变功能有着显著的优点,特 ...

  7. css3 渐变记

    css3 渐变 线性渐变 径向渐变 重复线性渐变 重复径向渐变 线性渐变 线性渐变接受三个参数,渐变的方向,起始颜色,结束颜色. 标准语法及参数:linear-gradient:([[<angl ...

  8. Css3渐变实例Demo(一)

    1.指定渐变背景的大小 .div { background: url(../img/1.jpg); /*background-size:contain;*/ width: 500px; height: ...

  9. Css3渐变(Gradients)-径向渐变

    CSS3径向渐变-radial-gradient()/repeating-radial-gradient() 径向渐变由它的中心定义. 创建径向渐变,至少定义两种颜色节点,呈现平稳过度的颜色.同时,你 ...

随机推荐

  1. Unity3D获取资源的方法整理:

    在使用Unity3D做项目时,获取资源的方法大致分为两种.一种是通过写代码的方式,在程序运行时,自动获取资源:一种是通过手动拖拽的方式进行获取.不管是什么类型的资源都能通过这两种方式获得,下面拿图片资 ...

  2. SpringCloud学习笔记(1)——Eureka

    Spring Cloud Spring Cloud为开发者快速构建通用的分布式系统(例如:配置管理.服务发现.断路器.智能路由.微代理.控制总线.一次性的Token.全局锁.领导者选举.分布式会话.集 ...

  3. KNN--用于手写数字识别

    优点:精度高,对异常值不敏感,无数据输入假定 缺点:计算复杂度高,空间复杂度高 适用数据范围:数值型和标称型   一般流程:     (1). 收集数据(网络抓取)     (2).处理数据,将数据处 ...

  4. 自己动手编写IOC框架(三)

    刚写博客浏览量第一天就有1000多人次,给了我很大的鼓舞决定熬夜再写一篇.对于前两篇来说无非就是使用dtd验证xml,然后解析xml,和IOC的核心还是差的很远,相信很多小伙伴们都感觉看得不过瘾了,这 ...

  5. 第四届河南省ACM 序号互换 进制转换

    序号互换 时间限制: 1 Sec  内存限制: 128 MB 提交: 41  解决: 19 [提交][状态][讨论版] 题目描述 Dr.Kong设计了一个聪明的机器人卡多,卡多会对电子表格中的单元格坐 ...

  6. linux配置分步安装lnmp环境----ghj

    前台:nignx 后台:apache[linux命令]用户文件目录启动定时任务:[开启RZ命令]yum -y install lrzsz [防火墙]防火墙配置文件: /etc/sysconfig/ip ...

  7. XAMPP重要文件目录及配置

    一.XAMPP 的安装过程 1:下载XAMPP 的 Linux 版 (1.7.4) http://www.apachefriends.org/en/xampp-linux.html#374 2:安装( ...

  8. 一个在 .NET 一线战斗了十年的 C# 程序员的内心独白

    这是我的一个内心独白,内容有点长,希望你能耐心地看完. 估计看到标题,大部分人都会说:哇!大牛!膜拜--之类的.至于是不是大牛,那我不知道,毕竟我依然有很多地方不懂,特别是现在已经流行的 Redis ...

  9. JSON序列化时消除空格

    使用 python 序列化时,通常使用 json.dumps()生成 json,但是会在key和value之间默认给你加上一个空格.传参时可能会应为这个空格导致服务端解析失败. 之前做接口测试时,就遇 ...

  10. [译]在Asp.Net Core 中使用外部登陆(google、微博...)

    原文出自Rui Figueiredo的博文<External Login Providers in ASP.NET Core> 摘要:本文主要介绍了使用外部登陆提供程序登陆的流程,以及身份 ...