IE6下使用CSS定义DIV高度行之有效的办法

你对IE6下CSS定义DIV高度的方法是否了解，这里和大家分享一下，相信通过本文的学习你对IE6下使用CSS定义DIV高度的方法一定会有深刻的认识。

IE6下CSS定义DIV高度的问题

IE6下默认的字体尺寸大致在12–14px之间，当你试图定义一个高度小于这个默认值的DIV的时候，IE会固执的认为这个层的高度不应该小于字体的行高。所以即使你用height:4px;来定义了一个DIV的高度，实际在IE下显示的仍然是一个12px左右高度的层。添加overflow:hidden解决问题。

 
 
 
  
  
  
＜ div style=”height:4px;overflow:hidden;”>＜/div> 
  
  
  
 
 
 

在IE6中，使用CSS定义DIV的高度的时候经常遇到这个问题，就是当DIV的最小高度小于一定的值以后，就会发现，无论你怎么设置最小高度，Div的高度会固定在一个值不再发生变动，这个问题很是烦人。如下面的情况。

HTML代码

 
 
 
  
  
  
＜html> 
  
  
  
 
  
  
  
＜head> 
  
  
  
＜title> 
  
  
  
 
  
  
  
＜/title> 
  
  
  
 
  
  
  
＜styletype="text/css"> 
  
  
  
 
  
  
  
＜!--#testdiv{background:#009900;height:3px;}-->＜/style>＜/head>＜body> 
  
  
  
＜divid="testdiv"> 
  
  
  
 
  
  
  
＜/div> 
  
  
  
＜/body> 
  
  
  
 
  
  
  
＜/html> 
 
 

这是因为在IE6中，系统默认的并非是Div有一个默认的高度，而是你没有解决一个隐藏的参数，font-size，这个是ie6中对于Div属性中的font-size大小和你系统css中定义的font-size有很大关系，因此必须单独定义这个Div的font-size，这样才能解决这个问题。更改后的代码如下。
HTML代码

 
 
 
  
  
  
＜html> 
  
  
  
 
  
  
  
＜head> 
  
  
  
 
  
  
  
＜title> 
  
  
  
 
  
  
  
＜/title> 
  
  
  
 
  
  
  
＜styletype="text/css"> 
  
  
  
 
  
  
  
＜!--#testdiv{background:#009900;height:3px;font-size:0px;}-->＜/style>＜/head>＜body>＜divid="testdiv"> 
  
  
  
 
  
  
  
＜/div> 
  
  
  
 
  
  
  
＜/body> 
  
  
  
 
  
  
  
＜/html> 
 
 

【编辑推荐】

1. 区分IE6 IE7和IE8浏览器行之有效的办法
2. 探究IE8与IE7具体功能中窗口功能按钮的变化
3. IE6 IE7 IE8三个版本的CSS兼容速查手册
4. 探秘IE8 JavaScript功能超乎想象
5. 技术前沿 一段JS代码轻松解决IE6-IE8的兼容性问题

新闻名称：IE6下使用CSS定义DIV高度行之有效的办法
当前网址：http://www.shufengxianlan.com/qtweb/news38/382588.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联