IE6浏览器下设置div的高度

原创 2015年07月09日 09:33:17
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.51texiao.cn/" />
<title>蚂蚁部落</title>
<style type="text/css">
.mytest{
  width:100px;
  height:1px;
  border:1px solid red;
  font-size:0px;
  overflow:hidden;
}
</style>
</head>
<body>
<div class="mytest"></div> 
</body>
</html>

IE6浏览器下如何设置div的高度:
建议:尽可能的手写代码,可以有效的提高学习效率和深度。

在IE6浏览器下,我们可能无法随心所欲的设置一个div的高度,因为在IE6浏览器下,div的高度好像和字体大小联系在一起的,如果你不设置字体的大小,那么将无法将div的高度设置到小于12px的尺寸。例如:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.51texiao.cn/" />
<title>蚂蚁部落</title>
<style type="text/css">
.mytest{
  width:100px;
  height:5px;
  border:1px solid red;
}
</style>
</head>
<body>
<div class="mytest"></div> 
</body>
</html>

以上在代码在标准浏览器下,是正常的,但是在IE6浏览器下,无法将div高度设置为5px,高度依然是12px。解决方法就是将div的字体大小设置为0px,然后即可设置更小的高度了,但是最小高度只能够设置到2px。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.51texiao.cn/" />
<title>蚂蚁部落</title>
<style type="text/css">
.mytest{
  width:100px;
  height:1px;
  border:1px solid red;
  font-size:0px;
}
</style>
</head>
<body>
<div class="mytest"></div> 
</body>
</html>
如果想让div在IE6下高度可以随意设置的话,则需要添加overflow:hidden。例如:

Javascript获取页面各种宽度高度(各种浏览器ie6,ie7,firefox下怎么获取更好兼容)

关于获取各种浏览器可见窗口大小的一点点研究,这里面有些在兼容性不是很好,请看后面的介绍。 function getInfo() {     var s = "";     s += " 网...
  • junmoxie
  • junmoxie
  • 2014年04月22日 16:44
  • 1995

分析div自动适应浏览器的高度

前端人员之间有一个普遍存在的问题,如何让一个div的高度自动延伸到浏览窗口100%的高度,在布局中,我们有时会用到高度自适应,例如,我们定义了一个 div,并且希望它的高度为窗口高度的100% ,那么...
  • dddddz
  • dddddz
  • 2013年04月11日 21:37
  • 4034

不同浏览器获取DOM元素的各种高度

HTML中高度和宽度的获取,跨浏览器兼容性,以及jQuery中操作
  • l522703297
  • l522703297
  • 2016年02月28日 03:47
  • 4979

fixedBox固定div漂浮代码 支持ie6以上大部分浏览器

fixedBox *{margin:0px;padding:0px;} body{height:3000px;} $(function() {  $(".fixedBox").ea...
  • zyx13859002783
  • zyx13859002783
  • 2014年06月25日 21:20
  • 5246

js 给div 添加选区,类似windows桌面选区一样,兼容ie6、7、8、9、10、Firefox、Google、所有浏览器

先来一张效果图: 兼容: IE6 反应有点迟钝,效果没有火狐好。 主要的效果就是,模仿windows桌面的那个选区。可以用选框选区图标。 由于js代码太多,只贴一段核心的代码。 ...
  • u010402518
  • u010402518
  • 2013年06月16日 13:39
  • 1525

DIV+CSS兼容性解决IE6/IE7/FF浏览器的通用方法

一、!important (功能有限)   随着IE7对!important的支持, !important 方法现在只针对IE6的兼容.(注意写法.记得该声明位置需要提前.)   例如:#exam...
  • qiujialongjjj
  • qiujialongjjj
  • 2011年07月27日 23:05
  • 502

DIV+CSS最小高度(兼容IE6\IE7\FF)

折腾了一上午,就是搞不定这个最小高度 min-height:的问题,因为min-height:只在IE7\FF中起作用。至于这个IE6死活就是不认。而我这个页面又必需得用这个最小高度来定。 页面是二...
  • e421083458
  • e421083458
  • 2012年12月20日 14:17
  • 850

div+css_兼容ie6_ie7_ie8_ie9和FireFox_Chrome等浏览器方法

  • 2011年10月29日 14:41
  • 70KB
  • 下载

Javascript获取页面各种宽度高度(各种浏览器ie6,ie7,firefox下怎么获取更好兼容)

关于获取各种浏览器可见窗口大小的一点点研究,这里面有些在兼容性不是很好,请看后面的介绍。 function getInfo() {     var s = "";     s += " 网...
  • junmoxie
  • junmoxie
  • 2014年04月22日 16:44
  • 1995

div+css 兼容ie6 ie7 ie8 ie9和FireFox Chrome等浏览器方法

1.DOCTYPE 影响 CSS 处理 2.FF: div 设置 margin-left, margin-right 为 auto 时已经居中, IE 不行 3.FF: body 设置 text-...
  • yyh1988923
  • yyh1988923
  • 2011年11月29日 13:19
  • 832
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:IE6浏览器下设置div的高度
举报原因:
原因补充:

(最多只允许输入30个字)