部分 CSS 的浏览器兼容处理

<!--[if !IE]><!--> 除 IE 浏览器外都可识别 <!--<![endif]-->

<!--[if IE]> 所有的 IE 浏览器可识别 <![endif]-->

<!--[if IE 6]> 仅 IE 6 浏览器可识别 <![endif]-->

!important:IE 6 不支持

<metahttp-equiv="x-ua-compatible" content="ie=7" />

 

问题	浏览器	解决方法
input[button | submit] 不能用 margin:0 auto; 居中	IE 8	为 input 添加 width
body{overflow:hidden;} 没有去掉滚动条	IE 6/7	设置 html{overflow:hidden}
hasLayout 的表情拥有高度	IE 6/7	*height:0,overflow:hidden
form>[hasLayout] 元素有margin-left时，子元素中的[input | textarea ] 出现 2倍 margin-left	IE 6/7	form>[hasLayout]{margin-left:宽度;} form div{*margin-left:宽度/2}
当 border-width 有1条到3条，且被设置成dotted 时，1px 的变dotted 显示成 dashed	IE7	不在用一个元素上使用不同宽度的 dotted
当子元素有position:relative 时，父元素设置overflow:[hidden|auto] 相当于给子元素设置了 position:visible	IE 6/7	给父元素设置 position:relative
:hover 伪类不能改变有 position:absolute 的子级元素的left/top 值	IE 7	把 top/left 设置成除 0% 外的百分值
:focus selector{} 选择器失效	IE 8	在失效选择器后台IT哪家一个空选择器 ,:focus{}
列表中混乱的浮动，在list中浮动图片时，图片出现溢出正常位置，或没有 list-style	IE 8	用背景图片替换 list-style
th 不会自动继承商家元素的 text-align	IE 8	给 th 添加 text-align:inhert;
:hover 时若 background-color 为 #fff 失效	IE 7	把 background-color 改成 background，或者非 #fff，非#ffffff
:first-letter 失效	IE 6	把 :first-letter 移动离{}最近的地方，如 h1,p:first-letter{},而非 p:first-letter,h1{}
position:absolute 元素中，a display:block,在非 :hover 时只有文本可点击	IE 6/7	给a 添加 background
float 列表元素不水平对齐：li不设置float，a设置display:block;float:[方向]，li不水平对齐	IE 6/7	给 li 设置 displayinline 或 float:[方向]
dt,dd,li 背景失效	IE 6	dt,dd,li{position:relative;}
使用 filter 处理的透明背景图片的透明部分不可点	IE 6-8	把 background:none 变成 background:url(链接)，连接到本身和图片之外的任何文件
li 内元素偏离 baseline 向下拉	IE 8	给 li 设置 display:inline 或 float[方向]
列表中 li 的 list-style 不显示	IE 6/7	给 li 添加 margin-left,留空间来显示（不要加在 ul 上）
图片不能垂直居中	IE 6/7	添加一个空标签，并赋给“Layout”，比如 display:inline-block
背景溢出，拖动滚动条后显示正常	IE 6	给父元素添加 overflow:hidden 防止溢出，并赋予 hasLayout
高度超出 height 定义的高	IE 6	添加 overflow:hidden,或 font-size:0
双倍行距	IE 6	添加 display:inline 到 float 元素中
text-align： 影响块级元素	IE 6/7	整理 float,或者分开设置text-align
3px 间隔：在 float 元素后的元素，会有3px间隔	IE 6	margin-left:-3px