一、

\:选择IE6+

//区分 IE 8(不实用)
.title{
color:yellow\0;
color: red\9\0;
}

\9在 IE 6及其以上都可以识别(但是 IE11不识别 ,IE 5 识别,IE5.5不识别)

 \9\0 IE8、IE11不识别,IE9 IE10 识别    

可用:

\:选择IE8+和Opera15以下的浏览器

更好用的是ie浏览器独有的文档注释的方式:

<!DOCTYPE html>
<!--[if IE ]> <html class="ie8" lang="en"> <![endif]-->
<!--[if IE ]> <html class="ie9" lang="en"> <![endif]-->
<!--[if (gt IE )|!(IE)]><!-->
<html lang="en"> <!--<![endif]-->

二、

   IE7 及以上版本 : 子选择符 (E>F), 相邻选择符(E+F),兄弟选择符(E~F), :fist-child , !important

   IE 9 及以上 : :last-child  :nth-child(父元素的第n个子元素)   :nth-of-type(n) (同类型第n个同级兄弟元素)

  如果浏览器 不支持的选择器和支持的选择器写在一起,用sass写在一块那么整条规则就不起作用了

三、 

     input设置了左右padding,but输入较多内容时padding还是会消失。

  这个问题是无解的,ie浏览器她就是这么渲染input的,解决方法是在input 外面套一层div,用div设置左右padding,border,width和height,input只需要设置width和weight为

100% 即可。

    另外,正常来讲,如果没有明确设置height的值,那么设置的line-height值就是height的值,but对于ie8,如果input 设置了 line-height,那么input必须设置height,否则input

  的内容显示有问题,会上下隐藏部分内容

四、

  input,img,iframe等元素不支持伪元素

五、

  IE8对background-position 并不是完全支持

  sprite图中的icons之间最好留空白间隔,否则ie8下会出现使用了某一个icon当背景,icon后面跟着的其他icon也顺带显示了一小部分的bug,

参考:http://www.cnblogs.com/suspiderweb/p/5277540.html

css兼容性大坑的更多相关文章

  1. css兼容性问题的整理

    css兼容性问题的整理 1.文字本身的大小不兼容.同样是font-size:14px的宋体文字,在不同浏览器下占的空间是不一样的,ie下实际占高16px,下留白3px,ff下实际占高17px,上留白1 ...

  2. CSS兼容性详解

    前面的话 对于前端工程师来说,不想面对又不得不面对的一个问题就是兼容性.在几年之前,处理兼容性,一般地就是处理IE低版本浏览器的兼容性.而近几年,随着移动端的发展,工程师也需要注意手机兼容性了.本文将 ...

  3. css 兼容性问题,整理

    css 兼容性问题,整理: css 兼容性问题 说明 <input type="number"> 在chrome下,是不能输入非数字的字符的:但是在火狐63.0.3(2 ...

  4. IE和Firefox浏览器CSS兼容性技巧整理

    转自:http://homepage.yesky.com/185/11484185all.shtml#p11484185 CSS兼容常用技巧(1) 更多精彩相关文章推荐: 各大浏览器 CSS3 和 H ...

  5. CSS 兼容性支持

    CSS 兼容性支持 在一个CSS属性还没有成为标准之前,各浏览器厂商已经做了这个属性的实现,可能各浏览器实现不尽相同,所以加入属性前缀区分. safari , chrome:-webkit- oper ...

  6. 浏览器对DIV+CSS兼容性问题大总结

    浏览器对DIV+CSS兼容性问题大总结 接触DIV+CSS架构已经快两年了,个人觉得css入门不难,但要学精并非一朝一夕的,现在大部分网络公司都比较主张用div+css来布局,这就面临着一个比较难的问 ...

  7. 解决css兼容性

    关于CSS对各个浏览器兼容已经是老生常谈的问题了, 网络上的教程遍地都是.以下内容没有太多新颖, 纯属个人总结, 希望能对初学者有一定的帮助. 一.CSS HACK 以下两种方法几乎能解决现今所有HA ...

  8. 前端css兼容性与易混淆的点

    一.常用的骨灰级清除浮动 .clearfix:after { content: "."; display: block; height:; clear: both; visibil ...

  9. IE7,6与Fireofx的CSS兼容性处理方法集结

    CSS对浏览器的兼容性有时让人很头疼,尤其是对于IE6这个问题多多的浏览器版本,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码 ...

随机推荐

  1. 去除inline-block元素间间距

    根本原因:inline-block元素之间之所以有空白间距是因为空格有字体大小原因. 第一种: 把代码之间的换行空白都去掉. 例如: <div>第一个inline-block元素</ ...

  2. [LeetCode] Department Top Three Salaries 系里前三高薪水

    The Employee table holds all employees. Every employee has an Id, and there is also a column for the ...

  3. [LeetCode] Search in Rotated Sorted Array 在旋转有序数组中搜索

    Suppose a sorted array is rotated at some pivot unknown to you beforehand. (i.e., 0 1 2 4 5 6 7 migh ...

  4. Redis的三种启动方式

    转载:http://www.tuicool.com/articles/aQbQ3u Part I. 直接启动 下载 官网下载 安装 tar zxvf redis-2.8.9.tar.gz cd red ...

  5. day8-------socket网络编程

    简单的socket  一个server同时只能处理一个链接   代码如下: server端代码 #author = ruixin li import socket server = socket.so ...

  6. [webpack] 配置react+es6开发环境

    写在前面 每次开新项目都要重新安装需要的包,简单记录一下. 以下仅包含最简单的功能: 编译react 编译es6 打包src中入口文件index.js至dist webpack配置react+es6开 ...

  7. HYSBZ 2038 莫队算法

    小Z的袜子(hose) Time Limit:20000MS     Memory Limit:265216KB     64bit IO Format:%lld & %llu Submit  ...

  8. Azure 带宽

    Azure带宽与Azure Blob云存储 http://www.cnblogs.com/threestone/p/4497625.html

  9. 一个解析json串并组装echarts的option的函数解析

    缘起: 在组装echart页面的时候,遇到这样一个问题,它是一个需要在循环内层的时候,同时循环外层,在内层循环中就要将外层获取的值存入,导致了一种纠缠状态,费了老劲儿,终于得到如下解决.记录之,绿色为 ...

  10. 修改.net mvc中前端验证信息的显示方式

    最近一直在学习.net core的用法.想法是通过写一个新闻系统来熟悉一下这个最新的技术.其实,我以前一直对.net技术都是浅尝辄止,最主要原因是没有动力.平时写企业站因为时间原因,不是使用php的框 ...