自我总结，欢饮拍砖.

<!DOCTYPE HTML>
<html lang="en">
<head>
     <meta content="text/html;charset=UTF-8">
     <title>Document</title>
     <style type="text/css">
     #div1{ width:300px; height:300px; border: 1px solid black;}
     .gradient{
          background:-webkit-linear-gradient(top,#FFFFFF,#d33027);  /*以webkit浏览器引擎为基础的浏览器可以识别:chrome,opera , safari*/
          background:-moz-linear-gradient(top,#FFFFFF,#d33027);    /*支持火狐浏览器*/
          background:-ms-linear-gradient(top,#FFFFFF,#d33027);  /*支持ie10及ie以上版本*/
          background:linear-gradient(top,#FFFFFF,#d33027);
          -ms-filter:"progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#FFFFFF, endColorstr=#d33027)"; /*支持ie8,9*/
          +background:#eca7a3;   /*ie6,,ie7不支持，则取中间色*/
     }
     </style>
</head>
<body>
     <div id="div1" class="gradient"></div>
</body>

</html>

参考自：梦想天空 http://www.cnblogs.com/lhb25/archive/2013/01/30/css3-linear-gradient.html

htmlcss渐变及兼容性的更多相关文章

  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实现颜色渐变以及兼容性处理

    有时我们会看到网站上的一些图片是渐变色的,这些图片有的是ui设计出来的,有的则是直接通过css3制作出来的.下面就讲一下css3实现渐变色的方法,以及在各个浏览器上的兼容性. CSS3 Gradien ...

  3. css实现文字渐变

    css文件渐变虽然兼容性比较差,但是用在移动端和chrome中还是没有问题的. 实现文件渐变的方法有两种 1. 使用 background 的属性 2. 使用 mask 属性 方式一. <!DO ...

  4. html+css笔记

    文档结构 1.html文档结构 ①文档类型声明 严格型(标准模式):    <!DOCTYpE HTML>   HTML5 XHTML 1.0:<!DOCTYpE html pUbL ...

  5. DragLayout: QQ5.0侧拉菜单的新特效

    一.项目概要 1.1 项目效果如图: 1.2 需要使用到的技术   ViewDragHelper: 要实现和QQ5.0侧滑的特效,需要借助谷歌在2013年I/O大会上发布的ViewDragHelper ...

  6. icon-font图标介绍

    前言 像素完美(Pixel Perfection).分辨率无关(Resolution Independent)和多平台体验一致性是设计师们的追求. 可访问性(Accessability).加载性能和重 ...

  7. 响应式Web图形篇 —— icon fonts 的探析及应用

    前言 像素完美(Pixel Perfection).分辨率无关(Resolution Independent)和多平台体验一致性是设计师们的追求. 可访问性(Accessability).加载性能和重 ...

  8. 使用icomoon把svg图片生成字体图标

    今天看了使用icomoon来将svg转换成图标字体,本来是不会使用别人给的svg,也不清楚具体的好处是什么,查了svg以后,越来越懵,svg挺好的为什么要转成图标字体呢. 一.SVG介绍 SVG 是一 ...

  9. 手摸手带你学移动端WEB开发

    HTML常用标签总结 手摸手带你学CSS HTML5与CSS3知识点总结 手摸手带你学移动端WEB开发 好好学习,天天向上 本文已收录至我的Github仓库DayDayUP:github.com/Ro ...

随机推荐

  1. [linux] C语言Linux系统编程-TCP通信的11种状态

    三次握手由client主动发出SYN请求, 此时client处于SYN_SENT状态(第一次握手)当server收到之后会由LISTEN转变为SYN_REVD状态, 并回复client, client ...

  2. Oracle实战笔记（第二天）

    导读 今日主要内容:表管理.表操作(增删改查).表查询(简单查询&复杂查询).创建数据库. 一.表管理 1.表命名规范 必须以字母开头: 长度不能超过30个字符: 不能使用Oracle保留字: ...

  3. 图的存储结构的实现(C/C++实现)

    存档: #include <stdio.h> #include <stdlib.h> #define maxv 10 #define max 10 typedef char e ...

  4. Javac编译时出现包不存在的报错的解决方案

    今天在学习包类调用时出现如下错误: packa包不存在,在C盘目录下应该有这个包啊 原因是在当前目录下没找到,因为packa存放在其它目录下 如何解决: 应该配置一个classpath,直接把包所在的 ...

  5. How Many Sets I（容斥定理）

    题目链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3556 How Many Sets I Time Limit: 2 ...

  6. 客户端一致性与多Leader机制------《Designing Data-Intensive Applications》读书笔记7

    接着上一篇的内容,我们继续来梳理分布式系统之中的副本机制与副本一致.上文我们聊到了在可用性与一致性之间的一个折中的一致性等级:最终一致性.我们顺着上篇的内容,由用户来分析一致性等级. 1. 客户端的困 ...

  7. js取整并保留两位小数的方法

    js 四舍五入函数 toFixed(),里面的参数 就是保留小数的位数.注意 toFixed()方法只针对数字类型,如果是字符类型需要使用Number()等方法先转换数字类型再使用 document. ...

  8. Myeclipse2014 已有项目更换JDK

    原先项目使用JDK是1.7,今天项目加入了一个新包,只支持JAVA8,让我们都升级一下本地的JDK,我突然发现我还没有在myeclipse上升级过JDK呢.捣鼓了一下,也不难,记录一下. 1.下载ja ...

  9. c++---天梯赛---查验身份证

    ★题目: ★题目分析:本题要求输入一个数字n,随后n行输入n个身份证号码.之后进行进一步的判断把错误的身份证号码输出.如果全部正确输出All passed. ★思路方法: ①按题目要求输入. ②对前1 ...

  10. 十二个 ASP.NET Core 例子——中间件

    目录: 什么是中间件(IApplicationBuilder) 创建 顺序规则 Asp.Net Core 内置的中间件 1.什么是中间件 官方:中间件是组装成应用程序管道以处理请求和响应的软件.每个组 ...