<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. Genymotion填坑之路

    Genymotion是一款android的模拟器,之前用的一台电脑直接装上就可以用,后来换了一台机器,一直报获取不到IP,后来网上各种找方法,偶然发现网上说的是硬件问题: 在BIOS中将CPU的vir ...

  2. hdu Rescue

    因为要求的是最少的时间,很明显的是一个利用优先队列的bfs的题目,题目很一般. #include"iostream" #include"algorithm" # ...

  3. 如何用Apache POI操作Excel文件-----如何在已有的Excel文件中插入一行新的数据?

    在POI的第一节入门中,我们提供了两个简单的例子,一个是如何用Apache POI新建一个工作薄,另外一个例子是,如果用Apache POI新建一个工作表.那么在这个章节里面,我将会给大家演示一下,如 ...

  4. aggregate运用

    测试环境:192.168.1.55 mongo 192.168.1.55:30001show dbsuse gwgps 测试目标,求出两个班的总数,人数,平均分数等. 1. 数据准备db.person ...

  5. PHP 二维数组根据相同的值进行合并

    例如有一个二维数组 $arr: $arr = array( array( 'review_id' =>102 , 'url'=>'a.jpg', ), array( 'review_id' ...

  6. 获取在attr.xml中声明的主题样式

    在换肤时,先在attr.xml中定义Resource的属性名,再到stytle中,根据不同的主题,给属性赋值. 在布局文件中可直接以  android:background="?attr/a ...

  7. unity3d 基于物理渲染的问题解决

    最近1个月做了unity 次世代开发的一些程序方面的支持工作,当然也是基于物理渲染相关的,主要还是skyshop marmoset的使用吧,他算是unity4.x版本 PBR的优秀方案之一了但在使用以 ...

  8. 推荐的PHP编码规范

    推荐的PHP编码规范 发布时间: 2014-05-7 浏览次数:2754 分类: PHP教程 推荐的PHP编码规范 一 编辑器设置 1. 使用Tab缩进,不要使用空格 鉴于很多编辑器在保存文件时会自动 ...

  9. Jquery--array

    --遍历数组 $.each(Array, function(i, value) { this; //this指向当前元素 i; //i表示Array当前下标 value; //value表示Array ...

  10. 纸牌project

    用range[0,8)的列表表示牌,这些数字要出现两次.我们建议你通过连接两个range[0,8)的列表来创建这个list.利用Docs来安排列表串联操作 写一个draw handler啥样的draw ...