关键词：
CSS中一些兼容性问题就是浏览器兼容，而这些浏览器兼容问题主要是Ie和FF之间的争斗。
CSS hack中的一些事：
我们为了让页面形成统一的效果，要针对不同的浏览器或不同版本写出对应可解析的CSS样式，所以我们就把这个针对不同浏览器/版本而写CSS的过程叫做 CSS hack。
CSS hack主要有三种：IE条件注释法、CSS属性前缀法、选择器前缀法。
（1）IE条件注释法，即在正常代码之外添加判别IE浏览器或对应版本的条件注释，符合条件的浏览器或者版本号才回执行里边的代码。
1 <!--[if IE 8]> 2 <p>Welcome to Internet Explorer 8.</p> 3 <![endif]-->
(2)CSS属性前缀法，即是给css的属性添加前缀。比如 * 可以被IE6/IE7识别，但 _ 只能被IE6识别，IE6-IE10都可以识别 "9"，IE6不能识别!important FireFox不能识别 * _ 9
.type{
color: #111; /* all */
color: #2229; /* IE */
*color: #333; /* IE6/IE7 */
_color: #444; /* IE6 */
}
（3）选择器前缀法，顾名思义，就是给选择器加上前缀。
IE6可识别 *div{color:red;}
IE7可识别 *+div{color:red;}
下面来说一下主要的兼容性问题：
（1）最主要也是最常见的，就是浏览器对标签的默认支持不同，所以我们要统一，就要进行CSS reset . 最简单的初始化方法是 *{margin:0; padding:0;} 但不推荐，而且它也并不完善，我们一般推荐淘宝的样式初始化。
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; } body, button, input, select, textarea { font:12px/1.5tahoma, arial, 5b8b4f53; } h1, h2, h3, h4, h5, h6{ font-size:100%; } address, cite, dfn, em, var { font-style:normal; } code, kbd, pre, samp { font-family:couriernew, courier, monospace; } small{ font-size:12px; } ul, ol { list-style:none; } a { text-decoration:none; } a:hover { text-decoration:underline; } sup { vertical-align:text-top; } sub{ vertical-align:text-bottom; } legend { color:#000; } fieldset, img { border:0; } button, input, select, textarea { font-size:100%; } table { border-collapse:collapse; border-spacing:0; }
(2)IE6双边距bug: 块属性元素如果添加浮动之后，会产生双倍外边距bug。
解决方式：
给float元素添加display：inline-block 即可正常显示
(3)上下margin重合问题，相邻的两个div margin-left margin-right 不会重合，但相邻的margin-top margin-bottom会重合。
解决方式：
上下两个尽量不要同时使用margin—top和margin-bottom。
(4)超链接访问样式的问题，伪类要按照一定的顺序书写：
a:link{} a:visited{} a:hover{} a:active{}
(5)chrome下默认会将小于12px的文本强制按照12px来解析。解决办法是给其添加属性：
-webkit-text-size-adjust: none;
(6)png24位的图片在IE6下面会出现北京，所以最好还是使用png8格式的。
(7)IE盒模型和W3C标准盒模型：
IE盒模型：margin+border+padding+content；
W3C盒模型：margin+border+padding+content；
从上面的表达式看不出来IE盒模型与W3C盒模型有什么不同，例如一个盒子模型如下：margin:20px,border:10px,padding:10px;width:200px;height:50px;
如果用w3c盒子模型解释，那么这个盒子模型占用的：
宽度为：20*2+10*2+10*2+200=280px;
高度：20*2+10*2+20*2+50=130px;
盒子的实际宽度大小为:10*2+10*2+200=240px;
实际高度：10*2+10*2+50=90px;
用ie的盒子模型解释 ：
盒子在网页中占据的大小为20*2+200=240px; 高：20*2+50=90px;
盒子的实际大小为：宽度:200px, 高度:50px;
我们常常理解的盒子模型是w3c这样的盒子模型
(8)IE6div高度不能小于10px：
解决方式：
<div style="height:2px;overflow:hidden;background:#000000;width:778px;"></div> <div style="height:2px;font-size:2px;background:#000000;width:778px;">&nbps;</div>
希望大家能够理解，也希望自己能够加深一下记忆。
css中常见浏览器兼容性问题
...adding:0;备注：这个是最常见的也是最易解决的一个浏览器兼容性问题，几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0。浏览器兼容问题二：块属性标签flo 查看详情
前端兼容性问题——总览
在Web前端开发中，浏览器兼容性问题是一个常见的挑战。由于不同的浏览器实现了不同的标准和规范，因此相同的代码在不同的浏览器上可能会有不同的表现，或者甚至无法正常工作。前端兼容性问题——总览在Web前端开发中，... 查看详情
html和css在ie7中常见的兼容性问题
IE7及以下版本都会有这些问题1.IE7块转内联块问题 问题描述：好像块转内联块失败，依然不在一行排列 解决办法：给元素添加如下css *display:inline;*zoom:1; *display:inline;先把元素转成内联，再用*zoom:1;触发盒子有... 查看详情
在前端工作中遇到的一些常见的兼容问题
1.图片下方3像素：在div中插如图片时，图片会将div下方撑大3px；解决方案：（a）将<div>和<img>写在一行上（IE6、ie7）; （b）将<img>转为块状元素，给<img>添加声明：display:block; （c）给<div>... 查看详情
css兼容性常见问题总结
DIV＋CSS设计IE6、IE7、FF兼容性 DIV＋CSS网页布局这是一种趋势,我也开始顺应这股趋势了,不过在使用DIV＋CSS网站设计的时候，应该注意css样式兼容不同浏览器问题，特别是对完全使用DIV+CSS设计的网页，就应该更注意IE6IE7FF... 查看详情
css常见问题一（span文字如何居中）
参考技术A如果span设置了height那么直接使用line-height与设置的height值相同即可以实现垂直居中，例如:html中：然后在css中:即可实现span中，“这里是文字”部分文字内容的垂直居中。比使用padding-top的兼容性和效果多要好很多。 查看详情
常见的浏览器兼容性问题与解决方案——css篇
...码。备注：这个是最常见的也是最容易解决的一个浏览器兼容性问题。 2、块属性标签float后，又有横行的margin情况下，在IE 查看详情
移动端常见的一些兼容性问题
一、meta基础知识H5页面窗口自动调整到设备宽度，并禁止用户缩放页面<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" /> 忽略 查看详情
移动端常见的一些兼容性问题
1、安卓浏览器看背景图片，有些设备会模糊。是devicePixelRatio作怪，因为手机分辨率太小，如果按照分辨率来显示网页，这样字会非常小，所以苹果当初就把iPhone4的960*640分辨率，在网页里只显示了480*320，这样devicePixelRatio＝2。... 查看详情
常见的浏览器兼容性问题
浏览器兼容性问题一：不同浏览器的标签默认的外补丁和内补丁不同（margin和padding）问题症状：随便写几个标签，不加样式控制的情况下，各自的magin和padding差异较大。解决方案：css里*{margin:0;padding:0;}浏览器兼容性问题二：块... 查看详情
04.预处理器
...言，用来为CSS增加一些编程的的特性，无需考虑浏览器的兼容性问题，并且你可以在CSS中使用变量、简单的程序逻辑、函数等等在编程语言中的一些基本技巧，可以让你的CSS更简洁，适应性更强，代码更直观等诸多好处。常见的... 查看详情
前端之css常见兼容性问题
1、双倍浮动BUG：描述：块状元素设置了float属性后，又设置了横向的margin值，在IE6下显示的margin值要比设置的值大；解决方案：给float的元素添加display:inline;将其转换为内联元素；2、表单元素行高不一致：解决方案： ①、给... 查看详情
求职简历中一些常见的问题
...，是我们事业起步的第一步。最近，我和同事一起阅读了一些应聘前端开发人员的简历，发现很多简历都存在相同的问题。在这篇文章中，我罗列出我认为简历中存在问题的地方，供大家参考。问题一：过分夸大自己的能力某位... 查看详情
常见的兼容问题
...adding:0;备注：这个是最常见的也是最易解决的一个浏览器兼容性问题，几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0。浏览器兼容 查看详情
web开发中常见的兼容性解决方案(持续汇总...)
...我们可能有很多不同的代码实现方式，我们尽可能的选择兼容性高的写法。HTML篇CSS篇Javascript篇参考资料结束语每个程序员一生要学习100门语言。见识越广，计较越少，经历越多，抱怨越少，越闲，越矫情。 查看详情
ie8常见兼容问题及解决方法总结(代码片段)
...算是我和ie8的一次亲密接触吧。 总结了一些遇到的比较常见情况以及解决方法，不求全面，就当是笔记吧，以备以后查看。一、对不兼容html5标签和css3的一些属性的情况，可以使用如下js插件（1）html5shiv.js、htm... 查看详情
ie下常见的css兼容问题
1.border-radius边框圆角IE8及以下浏览器不支持border-radiuswebkit引擎支持-webkit-borderradius私有属性mozillaGecko引擎支持-moz-border-radius私有属性presto引擎和IE9+支持border-radius标准属性2.display:inline-blockIE6、IE7不识别inline-block但可以触发块元素 查看详情
常见浏览器兼容性问题
CSS部分浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同问题症状：随便写几个标签，不加样式控制的情况下，各自的margin和padding差异较大。碰到频率:100%解决方案：CSS里 *{margin:0;padding:0;}浏览器兼... 查看详情