当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > css别忘记清除浮动clear:both

CSS样式表
Webjx收集基于CSS+JS设计50款优秀的导航菜单
初学者简单学习CSS网页布局
CSS教程:一张图片实现圆角
基于CSS的网站导航菜单
CSS新特性:圆角边框多栏Gird布局背景设置
CSS实例教程:制作网页特殊产品列表
收集国外网站的25个CSS高级教程
CSS教程:制作圆角矩形的网站头像
网页推荐值得一看的CSS框架
有趣图例:你是一个网页设计师吗?
安装Firefox的Jetpack扩展的步骤
CSS教程:CSS制作3D立方体
Css教程:FireFox正常IE错位的绝对定位元素
CSS对IE6、IE7、IE8支持详细的易用的参考
CSS Sprites简介以及优缺点
CSS教程:避免使用滤镜
DIV+CSS佈局代码精简对SEO的影响
学习CSS需要知道的CSS基础知识
CSS教程:clip属性全知道
基于firebug的firefox扩展:css usage

CSS样式表 中的 css别忘记清除浮动clear:both


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 45 ::
收藏到网摘: n/a

总结下清除浮动的一般解决方案,做网页时要注意 用空标签清除
.clr {clear: both;}
<div id="layout">
<div id="left">Left</div>
<div id="right">Right</div>
<p class="clr"></p>
</div>
使用 overflow 属性
#layout {overflow:auto; zoom:1;}
<div id="layout">
<div id="left">Left</div>
<div id="right">Right</div>
</div>
使用 :after (非 IE 浏览器)
#layout:after{
display: block;
clear: both; content: "";
visibility:hidden; height: 0;
}
<div id="layout">
<div id="left">Left</div>
<div id="right">Right</div>
</div>注:使用 :after 需要注意几点,设置高度为零(height: 0;);content 是必须的,但其值可以为空