css 全局样式的定义

对css还是不熟悉，老是对全局样式无从下手。 从网易拷了一份，学习了一下。

body {margin:0; font:12px/1.5 \5b8b\4f53,Arial,sans-serif; background:#3d78aa;}
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;}
ol,ul {list-style:none;}
li{list-style-type:none;}
img{vertical-align:top;border:0;}
h1,h2,h3,h4,h5,h6{font-size:inherit; font-weight:normal;}
address,cite,code,em,th,i{font-weight:normal; font-style:normal;}
.hx a,.hx em,.fB{font-weight:bold;}
.clearfix{*zoom:1;}
.clearfix:after{display:block; overflow:hidden; clear:both; height:0; visibility:hidden; content:".";}
a {color:#252525; text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {color:#ba2636;text-decoration:underline;}
a:active {color:#ba2636;}

1、body, 需要记住的是margin,font。  font里面一次定义了12像素，1.5倍行高，宋体的Unicode码（由于在火狐和opera中不能很好的识别），无衬线字体Arial,sans-serif；

2、块元素的预定义 div dl dt dd ul li ol li h1~h6       【pre】(这要用于显示源码)form        【fieldset】(lengend 为标题，位于框中间，主要放在from里面，有特殊显示效果) input textarea      【blockquote】(浏览器在 blockquote 元素前后添加了换行，并增加了外边距。)  p   定义margin和padding属性均为0；

3、定义表格元素属性；

4、列表属性的定义，刚知道li前面的小图标可以用list-style:square inside url(../../img.png);来定义。 ol ul list-style为none ； li的list-style-type为none；

5、图片   居上，边框为0； vertical ; border;

6、超链接的一些属性

a {color:#252525; text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {color:#ba2636;text-decoration:underline;}
a:active {color:#ba2636;}  

关于clearfix，下面我会专门抽出一篇文章讨论。

DIV+CSS在不同浏览器中的注意问题

1、ff和ie对高度的渲染方法不同。ff严格按照高度渲染，而ie可以在设置了高度的情况下被撑开。

2、ie的margin在float方向相同时会翻倍。解决方法display:inlie
3、ie和ff中的body,p,hr,ul,li,dl,dt,dd的margin padding默认值不一样。制作网页前设置body,p,hr,ul,li,dl,dt,dd{margin:0;padding:0}
4、ie和ff中h1,h2,h3,h4,h5,h6,h7默认的字体大小不同。需要重新设置
5、ff和ie中对em的渲染效果不一样，简单方法，用单位px，避免用em
6、ie中图片在容器中，图片下面默认有3像素的空隙，解决方法：vertical-align:top
7、ie中有时候不清除浮动不会有问题。而ff严格按照浮动来排列。所以需要严格对每个浮动进行闭合。

CSS透明问题

8、 ff中padding的值会加到高度里面去，例如padding-top:10px;height:100px; 这个css ff翻译出来是 110px，而ie是100px，解决方法，不需要对ff和ie分别设置，直接按火狐的方法设置就可以，在高度中减去padding的值，ie不需要理 会，因为ie会自动撑开。
9、html注释在ie中有时候会影响效果，而ff不会
10、垃圾ie中未知情况下，内容会自动复制一份到下一行，解决方法：复制错位的容器放最下面，然后设置display:none隐藏即可。
11、ie中<ul><li>的代码间的空格可能影响到效果。而ff不会。

12、背景透明：IE：filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)。
　　FF：opacity:0.6。
　　[注]最好两个都写，并将opacity属性放在下面。

13.如何对齐文本与文本输入框加上vertical-align:middle; <style type=”text/css”> <!–input { width:200px; height:30px; border:1px solid red; vertical-align:middle; } –> </style>

14.怎么样才能让层显示在FLASH之上呢解决的办法是给FLASH设置透明<param name=”wmode”value=”transparent”/>

15.怎样使一个层垂直居中于浏览器中这里我们使用百分比绝对定位,与外补丁负值的方法,负值的大小为其自身宽度高度除以二<style type=”text/css”> <!–div { position:absolute; top:50%; lef:50%; margin:-100px 0 0 -100px; width:200px; height:200px; border:1px solid red; } –> </style> 

16.万能清除浮动

 .clearfix:after{
    clear:both; /* 清除浮动 */
    display:block;
    visibility:hidden; /* 设置伪类层内容块级不可见 */
    height:0;
    line-height:0; /* 高度和行高为0 */
    content:"";    /* 将伪类层内容清空 */
   }
   .clearfix{zoom:1}