YaHoo 初始化css代码+IE常见兼容问题汇总

来源:互联网 发布:java接口关键字 编辑:程序博客网 时间:2024/06/14 06:35

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td { 

margin:0; padding:0; 

}

body { 

background:#fff; color:#555; font-size:14px; font-family: Verdana, Arial, Helvetica, sans-serif; 

}

td,th,caption { 

font-size:14px; 

}

h1, h2, h3, h4, h5, h6 { 

font-weight:normal; font-size:100%; 

}

address, caption, cite, code, dfn, em, strong, th, var { 

font-style:normal; font-weight:normal;

}

a { 

color:#555; text-decoration:none; 

}

a:hover { 

text-decoration:underline; 

}

img { 

border:none;

 }

ol,ul,li { 

list-style:none; 

}

input, textarea, select, button { 

font:14px Verdana,Helvetica,Arial,sans-serif; 

}

table {

 border-collapse:collapse;

 }

html {

overflow-y: scroll;

} 


.clearfix:after {

content: "."; display: block; height:0; clear:both; visibility: hidden;

}

.clearfix { 

*zoom:1; 

}

=====================ie常见兼容问题汇总============================

1、有float+margin 导致双边距问题。

    解决方案:加入ie6、7下特有css样式 {float:left;margin:10px;*display:inline}

2、ie8及以上、google等兼容 display:inline-block 达到 float 效果,单ie6、ie7不兼容

    解决方案:{display:inline-block;*float:left;*display:inline}


注明(hack写法):

*display:inline; 表示在ie6、7下作用;
_display:inline; 表示仅在ie6下作用;

3、透明度兼容

  1. .transparent_class {  
  2.       filter:alpha(opacity=50);  
  3.       -moz-opacity:0.5;  
  4.       -khtml-opacity: 0.5;  
  5.       opacity: 0.5;  
  6. }  

0 0