`

CSS clear 用法

阅读更多
你不加clear:both在火狐,IE8中打开!!肯定是不行的foot会浮上去!!!但在IE6,7是显示正常页面!!
而加了clear:both浏览器所显示的效果都一致了(IE5没试)!!
代码没改就是放到一个页面里你试试
<html>
 <head>
  <title> New Document </title>
<style type ="text/css">
#head{width:100%; height:20px; background:#789;}
#left{float:left; width:200px; height:300px; background:#823;}
#right{float:right; width:200px; height:300px; background:#399;}
#foot{clear:both; width:100%; height:20px; background:#789;}
</style>
 </head>
<body>
   <div id="head">head</div>
<div id="left">left</div>
  <div id="right">right</div>
  <div id="foot">footer</div>
 </body>
</html>

 

分享到:
评论

相关推荐

    浅谈css清除浮动(clearfix和clear)的用法

    本文主要是讲解如何在 html 中使用 clearfix 和 clear,针对那些刚开始了解 css 的童鞋。关于 clearfix 和 clear 的样式在这里我就不写了。 下面就谈谈对于这两个 class 的用法,首先我们先看个例子: XML/HTML Code...

    css中的clear属性使用方法实例介绍

    本文介绍css中的clear属性使用方法,大家参考使用吧

    Firefox浏览器插件Firebug和CSS减肥工具CSS Usage(清理无用CSS样式的CSS精简工具)

    Clear: 清除扫描结果,当我们查看完网页,并对CSS 进行了修改后,我们就不需要以前的扫描结果了,那么我们就可以使用Clear功能键,清除以前的扫描结果缓存,重新开始其他的扫描. AutoScan: 我们的网站可能会有很多的页面,...

    CSS的clear属性清除浮动的基本用法示例

    清除浮动就是指解决浮动元素溢出容器的操作,其方法多种多样,这里我们来看最基本的一种:CSS的clear属性清除浮动的基本用法示例

    css的border和clear属性使用方法和示例

    主要介绍了css的border和clear属性使用方法和示例,需要的朋友可以参考下

    利用css的clear属性实现广告文字环绕效果

    利用css的clear属性实现广告文字环绕效果_网页代码站(www.webdm.cn) ;"&gt; ;height:100px;width:1px;"&gt;&lt;!--一个宽为1px的空白层,利用该层的高度控制广告层上下的位置。--&gt; ;height:250px;width:250px;clear:left;...

    零基础学HTML CSS源代码

    示例描述:本章演示DIV与CSS结合用法。 内联定义样式.html 内联定义样式.html 链入内部CSS样式.html 链入内部CSS样式.html 外链接.html 外链接.html 链接外部CSS样式.html 链接外部CSS样式....

    《CSS设计彻底研究》光盘源码

     4.1.8 实验7——使用clear属性清除浮动的影响   4.1.9 实验8——扩展盒子的高度   4.2 盒子的定位   4.2.1 static(静态定位)   4.2.2 relative(相对定位)   4.2.3 absolute(绝对定位)   ...

    详解CSS中clear:left/right的用法

    一、理解clear: left/clear: right 当想到clear: left的时候,自然会认为是“清除左浮动”,clear: right是清除右浮动。 其实现在想想,这样的理解与表示是不严谨的欠考虑的。 一般,现在中文圈流传的表述是:  ...

    css设计彻底研究 源代码

    4.1.7 实验6——全部向左浮动 4.1.8 实验7——使用clear属性清除浮动的影响 4.1.9 实验8——扩展盒子的高度 4.2 盒子的定位 4.2.1 static(静态定位) 4.2.2 relative(相对定位) 4.2.3 absolute...

    CSS网站布局实录 (第二版)PDF版

    7.1.2 常用CSS hack使用方法 7.1.3 CSS hack管理 7.2 IE条件注释功能 7.3 盒模型问题 7.3.1 盒模型hack 7.3.2 简单盒模型hack方法 7.4 IE捉迷藏 7.5 ul的不同表现 7.6 IE 3px问题 7.7 高度不适应 7.8 IE6断头台问题 ...

    CSS3 Columns:比table更好用的分列式布局方法

    幸运的是,CSS3里提供了一批新的创建列式布局的column属性,有了这些属性,我们不需要再使用float,clear,margin等属性进行调控,避免了很多麻烦。 CSS代码 CSS3里的column系列属性提供了各种不同的功能,通过组合...

    《CSS设计彻底研究》【中文PDF+源代码】

    4.1.8 实验7——使用clear属性清除浮动的影响 4.1.9 实验8——扩展盒子的高度 4.2 盒子的定位 4.2.1 static(静态定位) 4.2.2 relative(相对定位) 4.2.3 absolute(绝对定位) 4.2.4 fixed(固定...

    css浮动(float/clear)使用讲解

    主要介绍了css浮动(float/clear)使用方法,如果你理解CSS盒子模型,但对于浮动不理解,那么这篇文章可以帮助你

Global site tag (gtag.js) - Google Analytics