<!DOCTYPE html>

<html>

    <head>

        <meta http-equiv="content-type" content="text/html;charset=utf-8">

        <title>Linear一下，你就知道</title>

        <style type="text/css">

            html,body{margin: 0;padding: 0; height: 100%;}

            div{width: 33.3%;height: 100%; float: left;}

            .div1{

                background-image: -webkit-linear-gradient(top, #8fa1ff, #3757fa);

                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c6ff00', endColorstr='#538300', GradientType='0');

            }

            .div2{

                background-image: -webkit-linear-gradient(top,#ff4f02,#8f2c00);

                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c6ff00', endColorstr='#538300', GradientType='0');

            }

            .div3{

                background-image: -webkit-linear-gradient(top,#ccc,#000);

                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c6ff00', endColorstr='#538300', GradientType='0');

            }

        </style>

    </head>

    <body>

        <div class=div1 ></div>

        <div class=div2 ></div>

        <div class=div3 ></div>

    </body>

</html>

css3背景颜色渐变的更多相关文章

  1. 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 ...

  2. css3背景颜色渐变属性

    https://www.cnblogs.com/ningkyolei/p/4623697.html 很久之前写的一篇文章了,今天重新整理一下关于css3背景渐变的写法,至于是怎么来的,可以看下面渐变的 ...

  3. css3的背景颜色渐变@线性渐变

    背景颜色渐变之线性渐变 语法形式: firefox浏览器 background:-moz-linear-gradient(position/deg,startColor,endColor); oper ...

  4. css3实现背景颜色渐变，文字颜色渐变，边框颜色渐变

    css3的渐变可以使用2个或者多个指定的颜色之间显示平稳的过渡的效果.这篇文章主要介绍下css3实现背景颜色渐变,文字颜色渐变,边框颜色渐变的方法,以便大家学习参考! 1.css背景颜色渐变 代码: ...

  5. Android特效专辑(二)——ViewPager渲染背景颜色渐变(引导页)

    Android特效专辑(二)--ViewPager渲染背景颜色渐变(引导页) 首页:http://blog.csdn.net/qq_26787115/article/details/50439020 ...

  6. WPF 背景颜色渐变的滑动条实现

    原文:WPF 背景颜色渐变的滑动条实现 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/BYH371256/article/details/83507 ...

  7. 从零开始学习前端开发 — 17、CSS3背景与渐变

    一.css3背景切割: background-clip:border-box|padding-box|content-box; 作用: 用来设置背景的可见区域 a) border-box 默认值,背景 ...

  8. CSS3背景与渐变

    一.CSS3 背景图像区域 background-clip(指定背景绘制区域) ackground-clip: border-box / padding-box / content-box; /*没有 ...

  9. CSS3背景，渐变

    1,有利于代码维护,有利于使用debug进行调试打断点.2,后面三个都存在计算,所以分开写最好.背景复合属性最好的写法,background:#abcdef url() no-repeat 50px ...

随机推荐

  1. asp.net时间 日期(DateTime) 的格式处理

    日期格式化{0:yyyy-MM-dd HH:mm:ss.fff}与{0:yyyy-MM-dd hh:mm:ss.fff}的区别 使用24小时制格式化日期:{0:yyyy-MM-dd HH:mm:ss. ...

  2. Leetcode 205 Isomorphic Strings 字符串处理

    判断两个字符串是否同构 hs,ht就是每个字符出现的顺序 "egg" 与"add"的数字都是122 "foo"是122, 而"ba ...

  3. Liferay7 BPM门户开发之35: AssetTag的集成查询

    Tag是liferay中的Asset特性,可以用来对信息进行分类,在iferay中的Asset类型为: 1. Web Content(自定义内容) 2. Documents and Media(文档库 ...

  4. Eclipse崩溃后无法启动的问题解决

    一次Eclipse发生内存溢出(ADT环境,多打开几个xml文件内存占用就会飚升),强制结束任务,再次启动Eclipse发现闪退.查看workspace/.metadata/.log文件发现如下错误信 ...

  5. 用SDWebImage渐变加载图片

    用SDWebImage渐变加载图片 使用 使用请详细查看源码,只需要给定一个图片地址以及一个placeHolder图片(非必须)即可. 效果 源码 https://github.com/YouXian ...

  6. 如何选择开源许可证&如何修改项目使其符合某种开源许可证

    作者:zyl910 很多文章介绍了详细的解说了各种开源许可证及它们的区别.但是,具体该选择哪一种许可证?如何修改项目使其符合某种开源许可证?就很少见到指导了.于是本文探讨这两个问题. 一.如何选择开源 ...

  7. Windows 8 图标前面的勾选

    http://bbs.pcbeta.com/viewthread-999730-1-1.html 不管是桌面的图标还是资源管理器中的图标之前都出现了一个小小的方框.选中图标的时候会自动勾选那个框,如果 ...

  8. 【转】重新封装FetchUrl函数一枚，支持COOKIES，喜欢领走~!

    mjj520 发表于 2012-6-2 09:14 唉 cpu超级耗芸豆的 查了下开发文档,fetchurl原来是不算CPU的,是我误导了大家.  发表于 2012-6-1 17:30:17 |只看该 ...

  9. Discuz! 的编码规范

    http://open.discuz.net/?ac=document&page=dev_coderule 前言 本规范由编程原则组成,融合并提炼了开发人员长时间积累下来的成熟经验,意在帮助形 ...

  10. IOS从一个APP跳到另一个APP

    以下为跳转到大众点评APP代码如下: NSString *requestUrlString = @"dianping://shopinfo?id=1000"; NSURL *req ...