DIV中如何设置LINE的高度为1PX

最新推荐文章于 2022-08-08 17:23:17 发布

iteye_15838

最新推荐文章于 2022-08-08 17:23:17 发布

阅读量145

点赞数

分类专栏： css 文章标签： IE ASP Firefox

本文链接：https://blog.youkuaiyun.com/iteye_15838/article/details/81680783

版权

css 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了三种解决Internet Explorer中1像素高度DIV显示问题的方法：使用注释、设置行高及调整overflow属性。这些技巧有助于确保网页设计在不同浏览器上的一致性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

[引用]：http://www.meizi.cn/article.asp?id=57

通常我们是这样设置:
#headerLine{margin: 0px; padding: 0px; background: url(dian.gif); height: 1px;width:256px;}
这个在 FireFOX里面有有效果的,可惜在IE里面顶层到不1PX.
那么如何才能在IE中起作用那?下面来看下这个例子.
最好的方法就是在两个DIV之间加一个注释,就像TABLE一样,TABLE的解决办法是把默认的空格去掉或者加一像素图片,那么DIV中我们就可以这样写: <div id="headerLine"></div>为什么要加个注释哪?大家可以想想,注释在页面中是不显示的,那么他的默认值就可能为"0".

例１：<div id="headerLine"></div>
#headerLine{margin: 0px; padding: 0px; background: url(dian.gif); height: 1px;width:256px;}

　　另外还有一个解决方法，我们可以设置行高为1像素．因为在不设置的情况下ＩＥ的默认行高是1.5也就是15像素.

例2：<div id="headerLine"></div>
#headerLine{margin: 0px; padding: 0px; background: url(dian.gif); line-height: 1px;width:256px;}

最后一个解决办法,就是通过设置overflow(visible | auto | hidden | scroll 注释:hidden :不显示超过对象尺寸的内容.）的原始值来改变它的行高．

例３：<div id="headerLine"></div>
#headerLine{margin: 0px; padding: 0px; background: url(dian.gif); overflow: hidden; height: 1px；width:256px;}