常用CSS标签属性重置

作者:动易网络 来源:本站原创 点击数: 发布时间:2012年08月30日

做网页制作时经常因浏览器兼容不好而烦恼我们经常会遇到布局错位等常见问题,HTML+CSS 布局起着一个重要的决定性作用,它是提高页面浏览器兼容性的第一步。也就是接下来要介绍的标签重置。

先简单介绍一下什么是标签重置?

顾名思义,就是对HTML 中的标签属性重置,因为每个浏览器都有一个自己默认的CSS文件,对HTML 中的所有的标签进行定义,以便没有定义CSS 的页面能够正常显示在页面,页面在加载的时候如果没有找到自带的CSS 文件,浏览器就用事先为您准备好的CSS 样式,但是这个对于页面布局,没有什么用,所以我们需要将它们重新设置

有些人很喜欢用*{margin:0; padding:0;},其实不建议这么用,因为HTML 标签太多了,我们平时常用的也就那么几个,所以没有必要将所有标签重置,这样反而使页面加载速度变慢!特别是对于大站点,更不提倡!不过呢,如果页面出了问题,用这个可以检验一下,是不是有标签没有重置而导致的布局错位

 

以下是一些常用标签属性重置

 

@charset "utf-8";
/* CSS Document */
body{font-family:宋体,serif; background:#ffffff; font-size:12px;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,p{padding:0; margin:0;} 
table,td,tr,th{font-size:12px;}
table{margin:0 auto;}
img{vertical-align:top; border:none;}
ol,ul{list-style:none;}  
caption,th{text-align:left;}  
h1,h2,h3,h4,h5,h6{font-size:12px; font-weight:normal;}  
abbr,acronym{border:0;}
address,caption,cite,code,dfn,em,th,var{font-weight:normal; font-style:normal;}

/* link color font */

a{text-decoration:none;}
a:link {color:#333;}
a:visited{color:#333;}
a:hover{color:#8F0155;}
a:active{color:#BA2636;}
/*a{blr:expression(this.onFocus=this.blur())}*/