`
cuijiemin
  • 浏览: 265460 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

CSS 的 clear:both;

阅读更多

清除浮动div,一个该死的浮动在IE和FF上效果既然不同。


语法:

clear :none|left|right|both

参数:

none : 允许两边都可以有浮动对象
both : 不允许有浮动对象
left : 不允许左边有浮动对象
right : 不允许右边有浮动对象

说明:

该属性的值指出了不允许有浮动对象的边。请参阅float属性。
对应的脚本特性为clear。请参阅我编写的其他书目。

示例:

div { clear : left }
img { float: right }

分享到:
评论

相关推荐

    深度理解CSS clear:both的使用

    clear:both用来清除浮动这是一直来的印象,但是自己很少会用这个,理解其实也不太正确,今天查查了资料,记录一下 float的脱离文档流 float的原始作用是为了实现文字环绕的作用,可以理解为部分脱离文档流。 CSS中说...

    clear:both后margin-top不起作用其他左右下都起作用

    在CSS布局中,`clear:both`属性用于解决元素因前一个浮动元素而产生的环绕问题。当一个元素设置了`float:left`或`float:right`时,它会脱离常规文档流,而`clear:both`则用于清除这种浮动,使后续元素不再受到前面...

    css别忘记清除浮动clear:both

    这种方法是最简单的清除浮动方式之一,只需要在浮动元素后面添加一个空的`<p>`标签或者`<div>`标签,并应用`clear:both;`样式即可。 **示例代码**: ```html .clr { clear: both; } <div id="left">Left ...

    CSS——float属性及Clear:both备忘笔记

    通常,会在浮动元素的下方插入一个空的div元素,并为其添加class,比如“clear”,其CSS样式设置为“clear:both”。这样,该div会清除前面所有的浮动效果,从而使得父元素可以包含这个div,父元素的高度也会随之展开...

    CSS 浮动清理,不使用 clear:both标签

    传统上,开发者会使用`clear:both`属性来清除浮动影响,但这种方法有时候会引入不必要的元素。 在本例中,描述了一个不使用`clear:both`标签来实现浮动清理的方法。这种方法涉及到了创建一个特定的CSS类,名为...

    clear:both 的作用介绍

    为了解决这一问题,可以使用CSS属性“clear”,其中“clear:both”是该属性的一个常用值。 首先,我们需要了解什么是CSS的“clear”属性。该属性的作用是规定哪些边不应该与之前的浮动元素相邻。当元素的“clear”...

    清除浮动clear:both的应用详解

    常见的一种应用是在多列布局中,使用一个带有`clear:both`样式的元素来结束浮动,使得父容器能够包裹住所有的浮动子元素,防止所谓的"浮动塌陷"问题。例如,可以定义一个`.clear`类: ```css .clear { clear: both...

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

    在CSS布局中,`clear` 属性用于控制元素如何处理周围的浮动元素。当我们谈论 `clear:left` 和 `clear:right` 时,这是关于如何避免一个元素与左侧或右侧的浮动元素相邻的问题。这个属性通常用来解决浮动元素对周围非...

    css样式大全精华版.docx

    clear: both; ``` **4. 边距** (`margin`) - 示例: ```css margin: 10px 20px 15px 5px; /* 上 右 下 左 */ ``` **5. 内边距** (`padding`) - 示例: ```css padding: 10px 20px 15px 5px; /* 上 右 下 ...

    CSS样式文件格式化工具

    很多工具生成的Css 都是多行的,很占用空间,于是写了这个格式化工具,将一个样式格式化为一行。 如有不足之处 敬请斧正! 例如: .UserLogin_7{ width:213px; height:45px; clear:both; margin-left:0px; ...

    divcss布局:CSS布局方法介绍

    clear: both; } ``` 需要注意的是,当元素浮动后,它们会脱离正常的文档流,因此需要通过`clear`属性来清除浮动的影响。 ##### 1.2 Position布局 **position属性**用于指定元素的定位方式,包括: - `static`: ...

    html和css基础

    clear: both; ``` - **隐藏超出部分**: ```css overflow: hidden; ``` - **设置固定宽度**: ```css width: 100px; ``` - **临时边框**: ```css border: 1px solid; ``` - **IE和FF不同样式**: ```...

    css第04天.pdf

    签法(clearfix):在父元素末尾添加一个无内容的 clearing element,并为其添加样式 `clear: both;` 或 `overflow: auto;`。例如: ```html <!-- 子元素 --> <div class="child"></div> <div class="child"></...

    那些你所不知的CSS ::before 和::after 伪元素用法

    clear: both; } ``` - **引用样式**:为`blockquote`元素添加引用符号,使用`::before`和文字,而不是背景图像: ```css blockquote::before { content: open-quote; position: absolute; z-index: -1; ...

    css 的 float 与clear

    在CSS世界中,`float`和`clear`是两个非常重要的布局属性,它们在网页设计中扮演着不可或缺的角色。这两个属性对于理解盒模型以及创建复杂的网页布局至关重要。在这篇文章中,我们将深入探讨`float`和`clear`的概念...

Global site tag (gtag.js) - Google Analytics