网络编程 | 站长之家 | 网页制作 | 图形图象 | 操作系统 | 冲浪宝典 | 软件教学 | 网络办公 | 邮件系统 | 网络安全 | 认证考试 | 系统进程
Firefox | IE | Maxthon | 迅雷 | 电驴 | BitComet | FlashGet | QQ | QQ空间 | Vista | 输入法 | Ghost | Word | Excel | wps | Powerpoint
asp | .net | php | jsp | Sql | c# | Ajax | xml | Dreamweaver | FrontPages | Javascript | css | photoshop | fireworks | Flash | Cad | Discuz!
当前位置 > 网站建设学院 > 网页制作 > CSS
网页制作:Dreamweaver教程,FrontPages教程,Javascript教程,HTML教程,CSS教程,心得技巧,DHTML教程,网页特效,Discuz!论坛
本月文章推荐
.小技巧大问题,cellSpacing用css样.
.制作网页时CSS常用的十点技巧.
.CSS语法手册(五)颜色和背景属性 .
.很立体的CSS按钮菜单效果.
.css技巧:经典常用CSS使用技巧几则.
.使用CSS设置表格.
.CSS的学习应该注意学习方法.
.CSS文件可维护、可读性提高指南四.
.css文字重复ie bug导致文字的奇怪.
.DIV+CSS必须考虑的浏览器兼容的技.
.IE的IF条件注释使用备忘.
.GridView固定表头(不用javascrip.
.锦囊妙计 CSS实现样式布局22招.
.CSS制作圆角导航的另一思路.
.CSS入门教学十四个问与答.
.你知道这些css网页设计技巧吗.
.技巧总结:div中class与id的区别.
.CSS布局常用的方法.
.提升兼容不同浏览器CSS Hack的写.
.门户网站与大型网站的CSS架构与组.

CSS技巧DIV为空时占据空间的解决办法

发表日期:2007-10-20


  如果给div元素设置了宽度时,比如width:100%,此时div在IE中(IE6,IE7)将占据物理空间,而在FF中不占据物理空间(正确理解)。为了表述直观,将样式直接写在元素标签内:

  此时在IE中到底是什么在影响着最终的显示,又是如何解析的呢?

  可能的影响因素:字体大小(font-size),字体行高(line-height),高度(height),溢出(overflow)

  我们对上面的代码逐一添加过滤属性(具体的过程有兴趣的朋友,可以私下里实验一下,“自己动手,丰衣足食”!)

  在测试的过程中,你会发现IE6和IE7的解析也不尽相同,比如在给div设置了line-height:0; height:0; 的样式后,IE7中显示正常了,不再占据物理空间了,而IE6却依然我行我素,亦或是悲!

  最终的测试结果,最简单的方法是,给div设置高度(height)和溢出(overflow)属性:

上一篇:简单的CSS改进网站设计的三个技巧 人气:4112
下一篇:初学入门简单了解学习CSS的伪类 人气:4736
浏览全部CSS的内容 Dreamweaver插件下载 网页广告代码 祝你圣诞节快乐 2009年新年快乐