网站首页  注册会员  本站免费电影 留言板  繁體中文

 

您现在的位置: 陈鹏个人网站 >> 电脑应用 >> 网络应用 >> 网页制作 >> 正文
 

   
专 题 栏 目
相 关 文 章

用闲置N卡为A卡增加物理
Adobe Flash CS4 试用版
Photoshop CS3新特性概览
微软更新Live Mesh 增加
Adobe Illustrator CS3蓄
闪客一族看过来 FlashCS
最大规模 Adobe CS4套装
Adobe Photoshop CS4最新
Adobe发布Acrobat 9、CS
Adobe CS4网页制作套装测

 
增加CSS的overflow属性来清除浮动           
增加CSS的overflow属性来清除浮动
作者:陈鹏 文章来源:eNet 点击数: 更新时间:2009-9-12 8:46:11
 




 

这个方法不单使用简单,而且FF、OP、IE7都支持,从此可以告别那又长兼容性又差的FF清浮动的方法了。

方法真的很简单,只要为需要清浮动的标签加上overflow这个属性。

ul{
list-style:none;
height:auto;
margin:0;p
adding:0;
background-color:#436973;
}
li{
float:left;
width:80px;
height:80px;
background-color:#83B1DF;
}
.demo{
clear:both;
border:1px solid #FF00FF;
margin-bottom:5px;
}
.overflow{
overflow:auto;
zoom:1;
background-color:#43FF73;
}
ul{
list-style:none;
height:auto;
margin:0;
padding:0;
background-color:#436973;
}
li{
float:left;
width:80px;
height:80px;
background-color:#83B1DF;
}
.demo{
clear:both;
border:1px solid #FF00FF;
margin-bottom:5px;
}
.overflow{
overflow:auto;
zoom:1;
background-color:#43FF73;
}

 

HTML代码




  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9





  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9



其中zoom是为了IE6准备的。

注:忘了一个很重要的内容,并不是所有的overflow属性都可起来一样的效果,比如visible属性就只能对IE起作用。这样的话就有一个问题啦,如果要有高度,而且内容超出高度的时候,定义auto或hidden都可能会有一些不想要的效果出现。这里提供一个解决方案:对于IE6及以下版本的IE,可以直接定义高度;对于IE7、FF、OP,可定义min-height。


CSS代码 Webjx.Com

overflow
{
height:auto;
_height:200px;
min-height:200px;
verflow:auto;
zoom:1;
_overflow:visible;
} Webjx.Com

 

文章录入:陈鹏    责任编辑:陈鹏 
  • 上一篇文章:

  • 下一篇文章:
  • 【字体: 】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口
     
     
     
     
     

    Copyright © 2007 - 2009 chenpeng123.com All Rights Reserved
    本站所有文章,软件等均来自网络收集,不代表本站观点,仅供学习和研究使用。如有侵犯您的版权,请联系我们,本站将立即删除。
    鲁ICP备07014697号
    你是本站第 位访客