背景渐变

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. 使用sshkey的方式访问gitlab

    在使用jenkins创建jobs的时候配置git为ssh访问的方式报错 记录错误信息 Failed to connect to repository : Command "/usr/bin/ ...

  2. Celery 源码解析六:Events 的实现

    在 Celery 中,除了远程控制之外,还有一个元素可以让我们对分布式中的任务的状态有所掌控,而且从实际意义上来说,这个元素对 Celery 更为重要,这就是在本文中将要说到的 Event. 在 Ce ...

  3. iOS多线程--深度解析

    多线程 你们项目中为什么多线程用GCD而不用NSOperation呢? 你有没有发现国外的大牛他们多线程都是用NSOperation? 你能告诉我他们这样做的理由吗? 关系: ①:先搞清两者的关系,N ...

  4. kali 2.0中msf连接postgres数据库

    装好kali 2.0后直接运行msfconsole msf> db_status postgres selected, no connection 百度到的解决方法多是针对BT和kali 1.0 ...

  5. Chrome 浏览器报 filed to load resource:net err cache read failure 错误:

    在IE/FF下没有该错误提示,但在Chrome下命令行出现如下错误信息: Failed to load resource: net::ERR_CACHE_MISS 该问题是Chrome浏览器开发工具的 ...

  6. C# 串口接收数据中serialPort.close()死锁

    最近在做一个有关高铁模拟仓显示系统的客户端程序,在这个程序中要运用串口serialPort传输数据,因为每次接收数据结束后要更新UI界面,所以就用到了的Invoke,将更新UI的程序代码封装到一个方法 ...

  7. canvas动画之动态绘出六边形

    先上 demo: http://en.jsrun.net/W5iKp/show 这两天我一直在研究这个动画,花了大量的时间来想是如何实现的, 一开始我是想在进入 canvas 时按时间来用 lineT ...

  8. Thymleaf——工作笔记本

    Thymleaf(工作笔记本)  1,循环遍历 th:each="li,information:${information}"   2,文本  th:text="${nu ...

  9. [epub] epub.js的ePubReader函数报URI malformed错误的解决办法

    报错信息:URI malformed 今天遇到了一个奇怪的问题折腾三个小时,最后发现是作者在底层使用了decodeURIComponent进行URL解码,而我在应用层使用了escape/unescap ...

  10. webpack中实现按需加载

    webpack中的require.ensure()可以实现按需加载资源包括js,css等,它会给里面require的文件单独打包,不和主文件打包在一起,webpack会自动配置名字,如0.js,1.j ...