<!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. 文件上传小技巧/原生态【html篇】

    引语:大家都知道,html中上传文件就一个input,type=file就搞定了.但是,这个标签的样式,实在不值得提点什么,要改动他的样式,恐怕也是较难的.但是其实挺简单,今天就来说说上传文件小技巧吧 ...

  2. 虚拟机下samba简单安装配置

    系统是Win7 虚拟机是CenterOS6.5 1.关闭防火墙以及关闭SELINUX的强制模式(重要): service iptables stop//关闭防火墙 setenforce 0 //关闭S ...

  3. FreeCodeCamp 高级算法（个人向）

    freecodecamp 高级算法地址戳这里. freecodecamp的初级和中级算法,基本给个思路就能完成,而高级算法稍微麻烦了一点,所以我会把自己的解答思路写清楚,如果有错误或者更好的解法,欢迎 ...

  4. Struts2入门2 Struts2深入

    Struts2入门2 Struts2深入 链接: http://pan.baidu.com/s/1rdCDh 密码: sm5h 前言: 前面学习那一节,搞得我是在是太痛苦了.因为在Web项目中确实不知 ...

  5. HTML、XHTML XML和DHTML的区别

    XML与HTML的设计区别是:XML是用来存储数据的,重在数据本身.而HTML是用来定义数据的,重在数据的显示模式 XHTML(The Extensible HyperText Markup Lang ...

  6. Oracle的 Pfile生成

    SQL> create pfile from spfile; File created. SQL> [oracle@localhost dbs]$ ls -lrttotal 24-rw-r ...

  7. python安装包工具pip的安装

    官方的安装帮助页面:http://pip.readthedocs.org/en/latest/installing.html windows: 下载代码get-pip.py, 运行该代码, 这个代码会 ...

  8. android CheckBox的运用

    CheckBox定义一个同意协议的按钮,只要同意button才可以点击 XML代码 <CheckBox android:id="@+id/checkbox1" android ...

  9. 使用 SELinux 和 Smack 增强轻量级容器

    http://www.bitscn.com/os/linux/200904/158771.html 安全 Linux 容器实现指南 轻量级容器 又称作 Virtual Private Servers ...

  10. Python字符串的修改以及传参

    前两天去面试web developer,面试官提出一个问题,用JavaScript或者Python实现字符串反转,我选择了Python,然后写出了代码(错误的): #!/usr/bin/env pyt ...