.example1 {
width: 150px;
height: 80px;
background: -moz-linear-gradient( top,#ccc,#000);
       background: -o-linear-gradient( top,#ccc,#000);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ccc, endColorstr=#000);//ie

-ms-filter:"progid:DXImageTransform.Microsoft.gradient (GradientType=0,startColorstr=#ccc,endColorstr=#000)";
}

效果如下:

  

老式写法

background: -webkit-gradient(linear,center top,center bottom,from(#ccc), to(#000));

参考:http://www.cnblogs.com/lhb25/archive/2013/01/30/css3-linear-gradient.html

css3---线性渐变的更多相关文章

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

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

  2. 使用CSS3线性渐变实现图片闪光划过效果

    <p class="overimg"> <a><img src="http://www.nowamagic.net/librarys/ima ...

  3. CSS3 线性渐变(linear-gradient) 兼容IE8,IE9

    一.线性渐变在 Mozilla 下的应用     语法: -moz-linear-gradient( [<point> || <angle>,]? <stop>, ...

  4. CSS3线性渐变linear-gradient

    转自 http://www.w3cplus.com/content/css3-gradient CSS3的线性渐变 一.线性渐变在Mozilla下的应用 -moz-linear-gradient( [ ...

  5. CSS3 线性渐变linear-gradient

    CSS3 Gradient 分为 linear-gradient(线性渐变)和 radial-gradient(径 向渐变).为了更好的应用 CSS3 Gradient,需要先了解一下目前的几种现代浏 ...

  6. CSS3 线性渐变(linear-gradient)

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

  7. css3 线性渐变和径向渐变

    线性渐变:ie6以下不兼容 径向渐变:只支持firefox.Chrome和Safari <!DOCTYPE html> <html> <head> <meta ...

  8. CSS3线性渐变和径向渐变

    background:linear-gradient(to top left, blue,orange);//从右下角往左上角渐变 background:radial-gradient(to top ...

  9. CSS3 经典教程系列:CSS3 线性渐变(linear-gradient)

    摘自: http://www.cnblogs.com/lhb25/archive/2013/01/30/css3-linear-gradient.html

  10. CSS3线性渐变

    万恶的IE!!! <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

随机推荐

  1. 1668: [Usaco2006 Oct]Cow Pie Treasures 馅饼里的财富

    1668: [Usaco2006 Oct]Cow Pie Treasures 馅饼里的财富 Time Limit: 3 Sec  Memory Limit: 64 MBSubmit: 498  Sol ...

  2. jvm 线程实现机制

    简单记一下 实际上jvm 规范中并无做限制. 不同的jvm实现上存在一定差异.技术上的选择主要在 jvm的线程是如何和操作系统的线程对应的.有1:1 的线程实现模式,也有N:1的线程实现模式,更有M: ...

  3. Hibernate注解之@Enumerated

    Hibernate注解之@Enumerated 转:http://www.cnblogs.com/minideas/archive/2011/11/04/2235262.html @Enumerate ...

  4. windows phone 8.1开发:磁铁|Tile更新

    原文出自:http://www.bcmeng.com/tile/ 上一篇给大家分享了toast通知操作的方法,这一篇文章我们就来看windows phone 8.1开发中的磁铁更新.磁铁是window ...

  5. supervisor的集中化管理搭建

    1.supervisor很不错,可惜是单机版,所以上github上找了个管理工具supervisord-monitor. github地址: https://github.com/mlazarov/s ...

  6. 【C++】浅谈三大特性之一继承(一)

    一,为什么要引入继承? 继承是一个非常自然的概念,现实世界中的许多事物也都是具有继承性的. 例如,爸爸继承爷爷的特性,儿子又继承爸爸的特性等都属于继承的范畴.下面是一个简单的汽车分类图: 在这个分类图 ...

  7. HTML的语义化,你需要深入了解

    有关HTML的一些基础课程,很多网站都有讲,于我而言,真正实践起来,我只要求我能够让它表现出我所想要的结果即可.然而,这种要求,对于后期的维护与测试,真的是......想起日前我们所做的这个项目,那里 ...

  8. Object-C知识点

    Object-C常用的知识点,以下为我在实际开发中用到的知识点,但是又想不起来,需要百度一下的知识点 1. p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: ...

  9. ng指令控制一个元素的影藏的与显示几种方法的使用

    在ng中我们控制一个元素的显示与隐藏的方法: (1):ng-show=true/false 解释:ng-show使用的是display="block"/"none&quo ...

  10. Python之路-shell&计划任务

    开发脚本自动部署及监控1.编写脚本自动部署反向代理.web.nfs:要求: I.部署nginx反向代理三个web服务,调度算法使用加权轮询:           II.所有web服务使用共享存储nfs ...