常规浏览器内核：
1 .图像边界问题
ie8浏览器会在aimg图像中显示蓝色边框
解决方法：
common.css img { border:none； )2.照片下方的缝隙问题
在箱子里放图像的时候，箱子底部的边缘和图像底部的线有空白的距离
理由：照片和文本与基线对齐的间隙是基线和下划线之间的距离
解决方案：
vertical-align :中间； 字体大小33600； 行高度33600； 显示：块； 3 .低版本ie常见的兼容性问题(了解) ) ) ) ) ) ) ) ) )3. ie的兼容性问题) ) ) ) ) )3) ) ) ie ) ) ) 652 )
1.ie6小高个案问题
原因： ie6下有默认行
问题解决：
行高度33600； 字体大小33600； 2.ie6下浮动双边距离问题解决问题：浮动元素_display:inline；
3.ie7以下子元素的相对定位，母箱overflow失效问题的解决方案：母箱也加入相对定位
4.ie8不支持图像格式为. webp
5.ie6不支持：after，before不支持：after和：before
` ` ` html1.每个浏览器默认边距和边距不同问题症状：随意写几个选项卡，不加样式控制时，各自的边距和边距有很大的不同。 遭遇频率：100%解决方案：在CSS上*{margin:0； 垫：0； }注：这是最常见且容易解决的浏览器兼容性问题。 在几乎所有CSS文件的开头使用通配符*，将每个选项卡的内部和外部修补程序设置为0。 在html2.块属性标签float之后，如果存在横行的边距，则表示在IE6中设定边距比的大问题症状：的一般症状是，在IE6中后面的块被推到下一行而碰撞的频率： 90% (稍我们最常用的是div CSS布局。 div是典型的块特性标签，对于横向布局，我们通常用div float实现。 如果用边距实现横向间隔的设定，这是必然面临的兼容性问题。 3 .设置小高度的标签(通常小于10px )，在IE6、IE7游泳过程中达到超过自己设置高度的高度
问题症状：与IE6、7游泳中的该标签高度不受控制，超过了自己设置的高度
碰撞频率： 60%
解决方案：将overflow :隐藏设置为超出高度的标签； 或者，将行高设置为小于您设置的高度。
备注：这通常出现在我们设置了小圆形背景的标签上。 出现此问题的原因是，在IE8之前的浏览器中，标签具有最小缺省行高。 即使您的标签为空，此标签的高度也是默认的行高。
4 .设置行内属性标签、display:block后，采用浮动布局，且存在横行边距时，IE6间距错误问题症状： IE6间距比大于设置间距的概率： 20%解决方案后加入display:inline； 显示：表； 备注：为了设置行内的属性标签、宽度和高度，必须设置display:block； (输入标签特殊的情况除外)。 用float布局，如果有横向margin的话，在IE6下，他会有块属性float之后的横向margin的错误。 但是，因为本身就是内嵌属性标签，所以如果添加display:inline，就无法设置那个人想在一起的柠檬。 此时，需要在display:inline的后面添加display:talbe。 5 .默认图像有音调问题的症状。 当几个img标签放在一起时，有些浏览器具有默认间距，放入问题1中提到的通配符将不起作用。 遇到概率： 20%解决方案：使用浮动属性创建img布局注释。 因为img标签是行内属性标签，所以只要不超过容器的宽度，img标签就会排成一行，但某些浏览器的img标签之间存在间隔。 消除这个间隔，使用浮动是正道。 (使用负边距可以解决问题，但负边距本身是一种容易引起浏览器兼容性问题的用法)6.最小高度设置最小高度不兼容性问题症状。最小高度本身是不兼容的CSS属性设置最小高度时，各浏览器无法很好兼容的概率)5%解决的height:auto！ 导入； height:200px； overflow :可视化； 备注：在B/S系统前端运行时，我们往往还会有这样的需求。 内容小于300px等值时。 容器高度为300px； 如果内容高度大于此值，则容器高度将支撑得较高，而不是滚动条。 我们会面临这个互换性的问题。 7 .透明度兼容CSS设置. transparent _ class { filter : alpha (opacity=50 )； -moz-opacity:0.5； -khtml-opacity: 0.5； opacity: 0.5
; } 如果我们熟悉标签的默认属性的话，就能很好的理解为什么会出现兼容问题以及怎么去解决这些兼容问题。◆IE6认识的hacker 是下划线_ 和星号 *◆IE7 遨游认识的hacker是星号 *比如这样一个CSS设置：height:300px;*height:200px;_height:100px; IE6浏览器在读到height:300px的时候会认为高时300px；继续往下读，他也认识*heihgt， 所以当IE6读到*height:200px的时候会覆盖掉前一条的相冲突设置，认为高度是200px。继续往下读，IE6还认识_height,所以他又会覆盖掉200px高的设置，把高度设置为100px；IE7和遨游也是一样的从高度300px的设置往下读。当它们读到*height200px的时候就停下了，因为它们不认识_height。所以它们会把高度解析为200px，剩下的浏览器只认识第一个height:300px;所以他们会把高度解析为300px。因为优先级相同且想冲突的属性设置后一个会覆盖掉前一个，所以书写的次序是很重要的。 8.IE6双边距问题:在 IE6中设置了float , 同时又设置margin , 就会出现边距问题解决方案：设置display:inline; 9.当标签的高度设置小于10px，在IE6、IE7中会超出自己设置的高度解决方案：超出高度的标签设置overflow:hidden,或者设置line-height的值小于你的设置高度 10.图片默认有间距解决方案：使用float 为img 布局 11.IE9以下浏览器不能使用opacity解决方案：opacity: 0.5;filter: alpha(opacity = 50);filter: progid:DXImageTransform.Microsoft.Alpha(style = 0, opacity = 50); 12.边距重叠问题；当相邻两个元素都设置了margin 边距时，margin 将取最大值，舍弃最小值；解决方案：为了不让边重叠，可以给子元素增加一个父级元素，并设置父级元素为overflow:hidden； 13.cursor:hand 显示手型在safari 上不支持解决方案：统一使用 cursor:pointer 14.两个块级元素，父元素设置了overflow:auto；子元素设置了position:relative ;且高度大于父元素，在IE6、IE7会被隐藏而不是溢出；解决方案：父级元素设置position:relative