关于我们 广告服务 社区论坛
设为首页 加入收藏

行业新闻
服 务 器
模版下载
建站指南
冲浪宝典
办公软件
网站运营
操作系统
QQ 专题
网页制作
安全防御
视频教程
网络编程
SEO专区
软件下载
图像设计
Cisco
网页特效
Wap 技术
联盟赚钱
网页素材
 首页 | 企业建站 | 网页制作 | 网站运营 | 网络编程 | 图像设计 | 冲浪宝典 | 操作系统 | SEO专区 | 联盟赚钱 | Cisco

欢迎来到e天下网络首页>>网页制作>>CSS>>正文|CSS布局中DIV为空时在IE6的不同表现

CSS布局中DIV为空时在IE6的不同表现

[ 来路:21kn.com    时间:2007-7-7 21:03:02    点击: ]

 

  在实际应用中为了特殊的需要而用到一个空的DIV,并定义一个较小的高度值.通常的想法见下面代码:

HTML
<div></div>
CSS
div{
height:5px;
}

  以上代码在多数浏览器中都可正确显示,但我们在实际运用中,确不象理论上这么简单,特别的IE6中并非如你所想,好象有时可以定义高度,有时它就不知何原因失效了!

  先给出我的测试代码,然后在详细说明:

    [Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

  分析:从代码中我总结了一些知识点

  1.当一个空DIV只给高度时,它的高度在IE6下是可控的.一些元素如background-color,border...都不会影响高度的值;

  2.如样式中有了height的话那IE会默认会有一个高度,其它的值如zoom:1也会产生这个"layout"可以自己尝试测试其它样式;

  3.空DIV如果付与了一个"layout"的话,那么它的高度就与文字大小有关了,具体的文字大小所显示的实际高度值从测试页中可见;

  4.可以看出IE所能显示的文字的最小高度值为2PX;

  5.在实际解决问题中,我们就根据它的特点,因材施教,在样式中加入font-size:数值;如果height:12px;那么你的font-size要小于等于10px,也就是最大值可取到10px;在大的话会被文字撑开(撑开内容是IE6以下版本的一个BUG),所以最省事的方法也就是设置文字大小为0;

以都是用设字体大小的办法解决问题,有的人还要加入一个行高,经测试行高对高度没有影响.所以加入行高没有必要.

  第二个解决问题的方法是加入overflow:hidden;思路就是超出部分隐藏起来,这也是一个很好的方法!

  说了那么多,我们只是的用测试的手段来分析一下总结出它的规律,当做一个技术研究,这样印象也深入一些,其实就两种方法,你只要记住这两种方法就可以了.

第一种方法:

div{
font-size:0;/*关于单位的写法是:如果是0值就可以不用写单位,非0值要写单位;(你同样可以写为0px.)*/
}

第二种方法

div{
overflow:hidden;
}

purecss语:让我们一起在这里成长起来!祝每位看这篇文章的网友学习进步!

::::站长友情提示:多花一分钟学点什么都好::::

 

上一篇:符合网页标准的无限网页分级菜单  下一篇:经验分享:CSS组合CLASS来完成网页布局风格

 ::热点信息::

 

= = 免责声明 = =

① 欢迎转载我网所刊信息,请注明“来源:E天下网络”。
② 凡本网注明“来源:XXX(非E天下网络)”的作品,均转载自其它媒体,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。如因作品内容、版权和其它问题需要同本网联系的,请在30日内进行。
※联系方式:Airtofly@163.com

::推荐文章::

 

Dreamweaver8创建自定义代码片

::图像设计::

 

动态图片搜索家——GIF RUNN
软件搜索利器——FileFerret
实例说明构图要讲规律
Character Builder让你尽展靓
全景图速成者Cool360
三维模型速成工具——Canoma
剪贴专家SmartBoard 32
新世纪的图像处理利器——Ph
更多内容..

 

 

关于我们 广告服务 友情链接 合作伙伴 社区论坛 免责声明

Copyright © 2007   21kn.com Inc. All rights reserved.e天下网络工作室

网站白天客服QQ:26875416 (非24小时)  合作QQ:597004688    粤ICP备06026423号