<style>
.test {
width: 200px;
height: 200px;
background: -moz-linear-gradient(top, #8fa1ff, #3757fa); /* Firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #8fa1ff), color-stop(1, #3757fa)); /* Saf4+, Chrome */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8fa1ff', endColorstr='#3757fa', GradientType='0'); /* IE*/
}
</style>

<div class="test"></div>

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

  1. CSS3之背景色渐变

    在css2时代,页面背景色渐变,按钮背景渐变效果主要是通过图片实现,css3中可通过 gradient 实现背景色渐变,图片作为一种资源,每次在页面加载时都要从服务器下载,这样如果页面很大需要渐变的效 ...

  2. CSS3 Gradient 渐变

    转载自:http://www.w3cplus.com/content/css3-gradient CSS3发布很久了,现在在国外的一些页面上常能看到他的身影,这让我羡慕已久,只可惜在国内为了兼容IE, ...

  3. css 背景色渐变---和背景色透明

    1 背景色渐变 background:#fb0000; background: -webkit-gradient(linear, left top, left bottom, color-stop(0 ...

  4. 透明、圆角、阴影效果、背景色渐变、<a></a>去外层虚线、!!!表格标签<table>

    表格标签 <table> 代表表格 width:指表格的宽度           一种是像素 (浏览器缩小的时候出现滚动条)           一种是百分比(跟着浏览器的大小而大小) b ...

  5. CSS3技巧:利用css3径向渐变做一张优惠券(转)

    在很多购物网站上都能看到优惠券,代金券,什么什么的券,但基本都是图片直接放上去,那么你有没有想过css来做一个呢,反正我是这样想过.那么你怎么做呢,切图做背景平铺边缘,嗯,有这样想过,如今css3技术 ...

  6. CSS3之渐变Gradient

    渐变是CSS3中比较好玩的属性,学会了渐变,那么可以做出非常炫的东东哟.CSS3 中渐变——Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变). ...

  7. 谈谈一些有趣的CSS题目(十三)-- 巧妙地制作背景色渐变动画!

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

  8. 【CSS3】使用CSS3线性渐变实现图片闪光划过效果(转)

    原文:http://www.nowamagic.net/librarys/veda/detail/2600 资料参考: http://www.cnblogs.com/lhb25/archive/201 ...

  9. CSS3背景渐变。。。

    CSS3 Gradient 分为 linear-gradient(线性渐变)和 radial-gradient(径向渐变).而我们今天主要是针对线性渐变来剖析其具体的用法.为了更好的应用 CSS3 G ...

随机推荐

  1. javascript 数据类型 变量 类型转换运算符

    数据类型: 1.字符串(被双引号所包含的内容),小数,整数,日期时间,布尔型等. 2.变量: 都是通用类型的var,    定义一个变量格式:var a: 3.类型转换: 分为自动转换和强制转换,一般 ...

  2. Linux网桥设置

    1. sudo apt-get install bridge-utils   2. brctl --help Usage: brctl [commands]  commands:         ad ...

  3. 【液晶模块系列基础视频】1.1.iHMI43模块介绍

    [液晶模块系列基础视频]1.1.iHMI43模块介绍(上) [液晶模块系列基础视频]1.1.iHMI43模块介绍(下) ============================== 技术论坛:http ...

  4. hadoop MapReduce 笔记

    1.        MapReduce程序开发步骤 编写map 和 reduce 程序–> 单元测试 -> 编写驱动程序进行验证-> 本地数据集调试 ->  部署到集群运行 用 ...

  5. YII 查找View的5种方式

    别名开头,路径指定view文件@app/views/site/about.php //开头,使用 app目录下面的views//site/about.php /开头,使用当前Module中的views ...

  6. DS实验题 地鼠安家

    ★实验任务 fd是一个公认的美丽校园.一天,fd来了一群地鼠,编号为1到n,他们希望在这里定居.现在先由第一只地鼠往下打一个单位的距离,并且在那里安家.对于每一个已经安家的地鼠,如果他左下或右下没有邻 ...

  7. mysql 关于日期时间的字段类型

    mysql日期和时间类型 mysql有5种表示时间值的日期和时间类型,分别为.DATE,TIME,YEAR,DATETIME,TIMESTAMP. TIMESTAMP类型有专有的自动更新特性, TIM ...

  8. 使用 Intel GPA 与 分析3D程序和抓取模型

    原文链接在这里 http://dev.cra0kalo.com/?p=213 背景信息 Intel的GPA本身是一款图形分析软件,并没有设计从3D程序里抓取模型资源的功能,但这里作者是通过hook G ...

  9. 高手指南PHP安装配置

    高手指南PHP安装配置 2014-11-05 12:57:13   来源:   评论:0 次 点击:12 次 | 发布人:登陆查看   PHP的快速发展,它的功能越来越强大,运用它也变得很方便,下面我 ...

  10. 本田--CRV

    名称:CR-V 类型:紧凑型SUV 排量:2L/2.4L 变速箱:CVT无级变速 价格:18-25W 品牌:本田 生产:东风本田 历史:1995年第一代 外观特点:没啥特点= =空间算大的