div+css网页布局的几个总结

2011 - 6 - 5 作者 : Jimco 分类 : HTML/CSS

以下是工作中总结的一些技巧,留下备用,希望对看到的人有用~~

 

1、ul:默认的ul的margin和padding不是0,如果在导航中用到了左浮动的li,往往会把外部的div撑大,导致页面变形,改成: ul{margin:0px; padding:0px;}


2、img:

①这里牵涉的不同浏览器的问题,ie6里显示的图片height总是要大于准确值,这里就需要我们记住下面这一点 img{ display:block};

②页面中最好不要用大块背景,能平铺的要平铺,否则加载起来会很慢,也不利于以后的优化和扩展,当然也有些大的网站,现在都尽量把背景统一放到一张图片上,用background-postion来取得背景。

③最好的格式就是gif格式,即确保了背景透明,在ie6中又不会有阴影,有时gif图片会有锯齿,这就需要我们保存成web格式,设置一下matter,matter的值用背景颜色的值越相近越好。


3、overflow:有时一些公司的注册协议都是很长,这就用到了overflow,可以把div的style里加上这个:overflow:auto

 

4、float:有时候一些div会挤到页面的上方,这里可能就是浮动引起的,可以加上clear:both。


5、div:height等于1px的div,在ie6中可能并不是1px,在这个div的style里加上font-size:1px;这样就ok了。


6、id和class:当一个样式在页面中多次使用时,不要用id,要用class,要使用js的时候,样式最好不要用id,因为id要留给js使用。


7,link:.link:link{}、.link:visited{}、.link:hover{}、.link:active{}。有一点,visited与hover的顺序一定不能倒换,否则ie6中会大大的问题。

 

上一篇:阿狸呀阿狸~ 下一篇:

4033 人围观 / 16 条评论 ↓快速评论↓

  • 阿狸2我一般都先写好 * {padding:0;margin:0;}
    另外img {border:none;}  否则IE下的图片会有一个描边

    Aikur 2011-06-10 12:21 回复

  • 呵呵 我是东方博客,看到你的留言了。
    我添加好你的连接了。

    风逐蓝天 2011-06-07 20:27 回复

  • 很多人写CSS时都会把许多标签的默认值重置为0的。否则,怎么对付浏览器的差异呀!

    ixwebhosting 2011-06-07 16:12 回复

    • @ixwebhosting:阿狸1其它浏览器还好对付~除了尼玛的IE6~~~

      Jimco 2011-06-07 22:46 回复

  • 来看看了,端午节快乐!

    太子虹 2011-06-06 17:39 回复

    • @太子虹:呵呵~哪都有太子的身影!端午节快乐!!

      Jimco 2011-06-06 19:01 回复

  • 第一次来访,先看文章

    常州SEO 2011-06-05 20:54 回复

    • @常州SEO:^_^多谢给力!欢迎常来走动!!

      Jimco 2011-06-06 19:02 回复

(必须)

(必须,保密)

阿狸1 阿狸2 阿狸3 阿狸4 阿狸5 阿狸6 阿狸7 阿狸8 阿狸9 阿狸10 阿狸11 阿狸12 阿狸13 阿狸14 阿狸15 阿狸16 阿狸17 阿狸18

Powered by Jimco

©2013 前端那些事儿 Designed by Jimco

About me|意见反馈