<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Linear</title>

    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

    <style>

        div {

            width: 400px;

            height: 100px;

            background-color: #0a0;

            border-radius: 5px;

            background-image: -webkit-linear-gradient(#0c0, #0a0);

            background-image: -moz-linear-gradient(#0c0, #0a0);

            background-image: -ms-linear-gradient(#0c0, #0a0);

            background-image: -o-linear-gradient(#0c0, #0a0);

            background-image: linear-gradient(#0c0, #0a0);

        }

    </style>

</head>

<body>

    <div></div>

</body>

</html>

CSS3 线型渐变的更多相关文章

  1. 关于CSS3线型渐变这些事儿

    CSS3兼容各浏览器的线型渐变方法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  2. CSS3 Gradient 渐变

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

  3. CSS3技巧：利用css3径向渐变做一张优惠券（转）

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

  4. CSS3之渐变Gradient

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

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

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

  6. CSS3背景渐变。。。

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

  7. 超多的CSS3圆角渐变网页按钮

    <!DOCTYPE html><head><title>超多的CSS3圆角渐变按钮</title><style type="text/c ...

  8. css3背景渐变以及图片混合渲染模式（一）

    一.CSS3 渐变(Gradients):CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳的过渡. 以前,你必须使用图像来实现这些效果.但是,通过使用 CSS3 渐变(g ...

  9. CSS3 文字渐变动画

    背景剪裁 语法:background-clip: border-box || padding-box || context-box || no-clip || text 本次用到的就是: -webki ...

随机推荐

  1. 如何测试本地是否能够正常访问云服务器的 Web 端口

    在windows环境下打开DOS命令行 使用telnet命令.例如 telnet www.baidu.com 80 插播一条小知识:DOS下清屏的命令是cls. 首先很不幸,出现了['telnet' ...

  2. 实现jsp页面显示用户登录信息，利用session保存。

    这是后台代码 这是jsp代码,上面是声明,下面是获得值.

  3. js中对style中的多个属性进行设值

    js中对style中的多个属性进行设值: 看一下案例自然就明白: document.getElementById("my_wz1").style.cssText="bac ...

  4. 【纯欧拉函数】 poj 2407

    #include <cstdio> #include <iostream> using namespace std; int phi(int x) { int t=x; ;i& ...

  5. javaScript 新学习：Array.contains 函数

    Array.contains 函数 确定指定对象是否是 Array 对象中的元素. 此函数是静态的,可在不创建对象实例的情况下调用. var itemExists = Array.contains(a ...

  6. POJ 2234 Matches Game 尼姆博弈

    题目大意:尼姆博弈,判断是否先手必胜. 题目思路: 尼姆博弈:有n堆各a[]个物品,两个人轮流从某一堆取任意多的物品,规定每次至少取一个,多者不限,最后取光者得胜. 获胜规则:ans=(a[1]^a[ ...

  7. NSIndexPath 延伸

    转载自:http://my.oschina.net/u/2560887/blog/602095?fromerr=Dy4vj5Jd 这个类的实例描述了一个嵌套数组中特定节点的路径,一般叫做索引路径.1. ...

  8. JS里的CSS函数

    <title>无标题文档</title> <script> function css(obj,name,value){ if(arguments.length==2 ...

  9. TweenMax说明

    TweenMax 采用了与它的兄弟相似的易于学习的语法结构.实事上,因为它扩展自它们,TweenMax 可以做任何 TweenLite 和/或者 TweenFilterLite 能做的事,还加上了更多 ...

  10. android 多个shortCut快捷方式实现以及对58同城快捷方式的实现思路的研究

    这几天,项目中有个新需求,需要按照模块添加不同的快捷方式到桌面上,从而方便用户的使用.特意进行了研究并分析了下58上面桌面快捷方式的实现. 首先多个shortcut的实现: <activity ...