<!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. 浅谈压缩感知（二十六）：压缩感知重构算法之分段弱正交匹配追踪（SWOMP）

    主要内容: SWOMP的算法流程 SWOMP的MATLAB实现 一维信号的实验与结果 门限参数a.测量数M与重构成功概率关系的实验与结果 SWOMP与StOMP性能比较 一.SWOMP的算法流程 分段 ...

  2. Bootstrap的学习以及简单运用

    <!DOCTYPE html> <html> <head> <title>柠檬学院</title> <meta charset=&qu ...

  3. IOS开发之进阶篇第一章 - 姿势识别器UIPanGestureRecognizer

    今天讲一下姿势识别器,UIGestureRecognizer这个是抽象类 1.拍击UITapGestureRecognizer (任意次数的拍击) 2.向里或向外捏UIPinchGestureReco ...

  4. 从头学Android之Android布局管理：LinerLayout线性布局

    LinerLayout线性布局: 这种布局方式是指在这个里面的控件元素显线性,我们可以通过setOrientation(int orientation)来指定线性布局的显示方式,其值有:HORIZON ...

  5. es6学习笔记5--promise

    所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果.从语法上说,Promise是一个对象,从它可以获取异步操作的消息.Promise提供统一的API, ...

  6. 结构体快排回顾（sort）

    一般来说,我做竞赛的时候排序一般用快排 很快很方便 普通sort(从小到大) sort(a,a+n); 直接贴一段代码吧,包含了vector,sort,结构体等简单东西综合 #include < ...

  7. /etc/pam.d 与 /etc/security 密码策略

    PAM(Pluggable Authentication Modules )是由Sun提出的一种认证机制.它通过提供一些动态链接库和一套统一的API,将系统提供的服务 和该服务的认证方式分开,使得系统 ...

  8. C#中使用委托、接口、匿名方法、泛型委托实现加减乘除算法

    使用C#实现加减乘除算法经常被用作新手练习.本篇来分别体验通过委托.接口.匿名方法.泛型委托来实现. 使用委托实现 加减乘除拥有相同的参数个数.类型和返回类型,首先想到了使用委托实现. //创建一个委 ...

  9. spring 4.2.0后jdbcTemplate中不用queryForLong了(之系统升级发现)

    在spring 3.2.2之后,jdbcTemplate.queryForInt已经被取消了! 原来是这样写的: String sql = "SELECT count(*) FROM USE ...

  10. LeetCode:Container With Most Water,Trapping Rain Water

    Container With Most Water 题目链接 Given n non-negative integers a1, a2, ..., an, where each represents ...