IE6下DIV无法实现height:1px高度问题解决办法

下午写页面遇到在ie6下无法实现height:1px,之前搞忘了,百度个收集几个解决方法,以供再次查阅。

IE6.0下DIV不能实现1px高度的几种解决方法

在设计网页时,有时我们需要一个1px高度的细线,但IE6有个bug,高度为1px的DIV在IE6里不管用。这是因为IE6中的DIV默认有个最小字体高度,DIV的最小高度就是这个高度,即使设置了height:1px,DIV显示出来的高度也不是1像素。

解决方法有如下几种:

1,网上都说多加一个font-size=0px;的属性可以实现.

以下为引用的内容:

 代码如下 复制代码
<style typestyle type="text/css">
.a{ 
font-size:0px; 
height:1px; 
background-color:red; 

</style>
<DIV class="a"></DIV>

但经过我的测试,细是细了,但不是1px,有点像是2px.不知道是我的浏览器问题,还是别的原因.你们可以用这个方法再测试一下.

2.多加一个line-height:1px的属性,不过得在DIV里多加一个 ,也就是空格,以下为引用的内容:

 代码如下 复制代码
<style typestyle type="text/css">
.a{ 
width:200px; 
height:1px;line-height:1px; 
background:red; 

</style>
<DIV class="a">&nbsp;</DIV>

这个方法我测试通过.很好用.如果你要做指定长度的细线,这个方法是个不错的选择.如果你的细线DIV长度是他父对象的长度的话,你可以用下面这个更简单的方法:

3,用border-top:1px solid #ff0000边框的方法制作一个细线.

以下为引用的内容:

 代码如下 复制代码
<style typestyle type="text/css">
.a{ 
border-top:1px solid #ff0000; 

</style>
<DIV class="a"></DIV>

注意:这个方法不能加width宽这个属性. 加了以后他会有高度(虽然表面上看不到,他是透明的)要是你这个细线下面再有DIV的话,他的高度就看出来了.再多加上一个font-size:1px;可以解决这个问题.

时间: 2024-09-20 14:33:31

IE6下DIV无法实现height:1px高度问题解决办法的相关文章

IE6下DIV高度显示的Bug收藏

IE6下默认的字体尺寸大致在 12 - 14px 之间,当你试图定义一个高度小于这个默认值的 div 的时候, IE 会固执的认为这个层的高度不应该小于字体的行高.所以即使你用 height: 6px; 来定义了一个 div 的高度,实际在 IE 下显示的仍然是一个 12 px 左右高度的层. 要解决这个问题,可以强制定义该 div 的字体尺寸,或者定义 overflow 属性来限制 div 高度的自动调整.比如 <div style="height: 6px; font: 0px Ari

ie6 下select遮罩住弹出层解决办法

使用JS做DIV弹出层时,一般地在IE下是无法遮罩ActiveX控件的,同时在IE6下Select也遮罩不住.在IE中ActiveX默认永远显示在最顶层,因此通过设置Style的Z-Index属性也无法改变遮罩关系的.在信息系统软件中,许多场合由于性能.操作等原因,往往会使用ActiveX代替Html来完成功能  代码如下 复制代码 var sd = XX.style.display; XX.style.display = "none";  ... //关闭弹出层后显示 XX.styl

ie6下png图片背景不透明的解决办法使用js实现_javascript技巧

我们时常在使用png图片的时候,在ie6下发生背景不透明的问题,下面给大家介绍下一个js解决的方式. 首先我们要用到一个js,代码如下: 复制代码 代码如下: /** * DD_belatedPNG: Adds IE6 support: PNG images for CSS background-image and HTML <IMG/>. * Author: Drew Diller * Email: drew.diller@gmail.com * URL: http://www.diller

jquery中在ie6下获取href属性值不到解决办法

想做一个ajax分页的功能,需要获取href属性的值. html文件  代码如下 复制代码 <div id="ajaxpage"> <span>47条/10页</span> <a href="?page=0" onclick="return false" >第一页</a> <a href="?page=2" onclick="return false&

IE6下div层被select控件遮住的问题解决方法

IE6下层被select控件遮住的问题想必大家在布局过程中都有遇到过吧,其实解决方法很简单就是在层里套个iframe,具体实现如下,感兴趣的朋友可以参考下,希望对大家有所帮助   这个应该在网上有很多解决的办法,只不过很多问题解决了之后就忘了,之后遇到了再去找有时就找不到了,就当给自己做个笔记了 方法很简单在层里套个iframe <div>能看见我了吗?<iframe frameborder="0" ></iframe></div> 有一

css实现 IE6下div垂直居中对齐

 代码如下 复制代码 <style type="text/css"> .fixVerticalCenterOuter{ width:300px; height:200px; border:1px solid #ccc; text-align:center; display:table-cell; vertical-align:middle; }   /* for IE 6 */ * html .fixVerticalCenterAdd { width:0; height:1

手机浏览器图片自适应高度问题解决办法

最近做PC站点的手机版,发现一个问题,图片在手机浏览器中显示效果有问题,宽度可以自动适应了,但是高度无法自动使用,调整css也没用,后来使用PHP正则替换的方式解决了手机浏览器图片自适应高度的问题. 一般情况下,解决手机浏览器自适应宽度和高度的方式是使用如下css即可: .content img{   max-width:100%;   height:auto; } 但是网页中图片的img标签是这样的: <img alt="湖北省第25届摄影艺术展" src="h/20

ie 6-ie6下div浮层遮挡不了下拉框

问题描述 ie6下div浮层遮挡不了下拉框 用iframe后,对浮层外进行滚轮操作,还是会出现遮挡不了下拉框问题. 求各路大神支招 解决方案 ie6太老了,需要用css hack 解决方案二: DIV层在IE6下被下拉框遮挡的解决方法IE6下, div层被select下拉框遮挡解决方案----------------------

CSS定义1px高度的div

div.lihe{ font-size:1px; line-height:1px; height:1px;} 这个应用的比较多的就是火狐浏览器的清除浮动: .clear{clear:both; font-size:1px; line-height:1px; height:1px; background:none; }