css兼容处理
#header{
margin-top: 13px; /* 所有浏览器都支持 */
margin-top: 13px\9; /* IE6、IE7、IE8、IE9支持 (所有IE)*/
margin-top: 13px !important; /* Firefox、IE7支持 */
_margin-top: 13px; /* IE6支持 */
*margin-top: 13px; /* IE6、IE7支持 */
+margin-top: 13px; /* IE7支持 */
margin-top: 13px\0; /* IE8、IE9支持 */
margin-top: 13px\9\0; /*IE9支持*/
- “-″减号是IE6专有的hack
- “\9″ IE6/IE7/IE8/IE9/IE10都生效
- “\0″ IE8/IE9/IE10都生效,是IE8/9/10的hack
- “\9\0″ 只对IE9/IE10生效,是IE9/10的hack
}
:root .rz-dropDown {
height: 12px//:root所有主流浏览器都支持 除IE8及以下
}
@-moz-document url-prefix() { .header_newsList { border:1.5px solid #208adb } }/*火狐单独样式*/
//背景色rgba兼容处理(IE9有问题的话就给IE9添加单独样式)
background: rgba(0, 0, 0, 0.7);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#B2000000, endColorstr=#B2000000);
//opacity:0.7\9\0;
//有时php文件和jsp文件中,line-height属性对img标签不起作用,无法实现图片垂直居中,可用如下方法解决(图片宽高不是百分百的情况下)
方法1:给img添加一个同级的元素<b>标签,给b标签设置属性display:inline-block;height:100%;vertical-align:middle;给img设置vertical-align:middle即可居中
img{vertical-align:middle;}
b{display:inline-block;height:100%;vertical-align:middle}
方法2:给img定位 img{margin:auto;position:absolute;top:0;left:0;right:0;bottom:0;}
让360浏览器兼容模式以IE最高版本内核渲染页面,需要在head中加入两个meta标签
<meta http-equiv="X-UA-Compatible" content="IE=edge" >
<meta name="renderer" content="webkit">
给li设置背景图(兼容IE5) 给li和ul设置均可
ul{ list-style: square inside url('eg_arrow.gif') }
//小于10号字体,浏览器兼容性处理
li span {
display: block;
width: 100%;
font-size: 10px;
-webkit-text-size-adjust: none;/*所有IE、火狐等都支持。除了360和高版本chrome*/
-webkit-transform: scale(0.8);/*高版本chrome和360中兼容处理方法*/
-webkit-transform-origin:top left;/*chrome和360中是将文字压缩,不加这句的话。基线是中间,就是文字压缩后会跑到中间*/
}
div{//背景图 平铺 兼容处理
background: url("../images/body_bg2.jpg") no-repeat center center; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/body_bg2.jpg',sizingMethod='scale');
}

http://www.jb51.net/css/493362.html
css兼容处理的更多相关文章
- CSS兼容各浏览器的hack
CSS兼容各浏览器的hack:建议:尽可能的手写代码,可以有效的提高学习效率和深度.浏览器的种类多,麻烦自然也多,主要是各种浏览器对某些属性的渲染效果并不相同,所以有时候需要专门针对特定浏览器或者特定 ...
- 主流浏览器css兼容问题的总结
最近又搞了一波网站的兼容,由于要求ie浏览器还是要兼容到ie8,所以调起来还是各种蛋疼. 现在就post一些做兼容的总结,可能不够全面,但是可以告诉大家如何避过一些坑.主要测试了chrome,fire ...
- CSS兼容问题实用建议
CSS兼容问题,是美工最头痛的问题.做测试时,用谷哥和360浏览器(最新)都没有什么问题,用 IE6/IE8测试,问题就冒出来了.微软现在出IE10,我电脑上已经无法用IE6准确测试,IE-TESTE ...
- css兼容问题集合
css兼容问题 兼容问题 1.文字本身的大小不兼容.同样是font-size:14px的宋体文字,在不同浏览器下占的空间是不一样的,ie下实际占高16px,下留白3px,ff下实际占高17px,上留白 ...
- css兼容各个浏览器的三角形图标
css兼容各个浏览器的三角形图标 在当前流行的的网站上,我们经常会看到一些小三角形的下拉提示(微博顶部的下拉菜单),简单的方式可以使用一张图片代替,但是随着前端技术的发展,以及开发者对于前端性能的“吹 ...
- CSS兼容常用技巧
请尽量用xhtml格式写代码,而且DOCTYPE影响 CSS 处理,作为W3C标准,一定要加DOCTYPE声明. 1.div的垂直居中问题 vertical-align:middle; 将行距增加到和 ...
- ie6 7 8 9 firefox的css兼容问题
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- css兼容问题与实践归纳总结
css兼容问题与实践归纳总结 一.IE6/7 原生块元素与display:inline-block; <div style="display:inline-block;"&g ...
- 浏览器 CSS 兼容写法的测试总结
做前端最讨厌的就是 IE6,7,8,虽然被淘汰的浏览器,但是在中国用户仍然很多,不可能像国外网站一样直接就不管它了,这样会流失很多流量啊. 现在有了IE9,IE10还好些,几乎和 Chrome,Fir ...
- Normalize.css源码注释翻译&浏览器css兼容问题的理解
版本v5.0.0源码地址: https://necolas.github.io/normalize.css/5.0.0/normalize.css 翻译版: /*! normalize.css v5. ...
随机推荐
- UVA10339 Watching Watches
题目大意:有两个表,每天都会慢一点时间,给出每天慢得秒数,问下一次重合的时刻. 解题思路:时刻重合也就是说整整差了一周,一周是12小时,用12小时的秒数除以两个表的相差那就是需要多少天的时间后重合,知 ...
- Shell 脚本面试问题大全
我们为你的面试准备选择了 70 个你可能遇到的 shell 脚本面试问题及解答.了解脚本或至少知道基础知识对系统管理员来说至关重要,它也有助于你在工作环境中自动完成很多任务.在过去的几年里,我们注意到 ...
- 十二 个经典 Linux 进程管理命令介绍
执行中的程序在称作进程.当程序以可执行文件存放在存储中,并且运行的时候,每个进程会被动态得分配系统资源.内存.安全属性和与之相关的状态.可以有多个进程关联到同一个程序,并同时执行不会互相干扰.操作系统 ...
- jquery之html(),text()方法详解
一:html() html()函数用于设置或返回当前jQuery对象所匹配的DOM元素内的html内容. 该函数的用途相当于设置或获取DOM元素的innerHTML属性值. 该函数属于jQuery对象 ...
- Eclipse中新建WEB项目,JSP页面报错。
在Eclipse中新建java web项目,在JSP页面的第一行提示这个错误: [The superclass "javax.servlet.http.HttpServlet" w ...
- Python基础学习笔记(八)常用字典内置函数和方法
参考资料: 1. <Python基础教程> 2. http://www.runoob.com/python/python-dictionary.html 3. http://www.lia ...
- Yii javascript 的结合 账号禁用 激活 的设置。
2014-02-16 控制器中的代码: public function actionUpdown(){ //print_r($_POST);die(); if(Buser::model()->u ...
- asp.net MVC开发过程中,使用到的方法(内置方法及使用说明)
® 视图的返回使用案例: [HttpGet] [SupportFilter] public ActionResult UserTopic(string type, string TopPicId, s ...
- struts2 传递数组、List、Map
struts2 传递数组.List.Map jsp文件 数组: <s:textfield name="ages" value="a1">&l ...
- Java中正则Matcher类的matches()、lookAt()和find()的区别<转>
在Matcher类中有matches.lookingAt和find都是匹配目标的方法,但容易混淆,整理它们的区别如下: matches:整个匹配,只有整个字符序列完全匹配成功,才返回True,否则返回 ...