CSS clear清除浮动
1、CSS中的clear有四个参数：
none：允许两边都可以浮动。
left：不允许左边有浮动。
right：不允许右边有浮动。
both(默认)；不允许有浮动。
2、一开始在CSS中clear浮动是默认both，也就是说一开始不能有浮动的。
3、使用的案例：假设我清除第三个DIV的浮动
<style type="text/css">
div{
border:1px solid red;
float:left;
clear:none;
}
#msg_Div{
width:600px;
height:600px;
}
.one{
width:100px;
height:90px;
}
.two{
width:100px;
height:90px;
}
.three{
width:100px;
height:90px;
clear:left;
}
.four{
width:100px;
height:90px;
}
.five{
width:100px;
height:90px;
}
</style>
<body>
<div id="msg_Div">
<div class="one"></div>
<div class="two"></div>
<div class="three"></div>
<div class="four"></div>
<div class="five"></div>
</div>
</body>
效果：
CSS clear清除浮动的更多相关文章
- CSS clear 清除浮动，兼容各浏览器
.clear:after{content:".";display:block;height:0;clear:both;visibility:hidden;} .clear{zoom ...
- 【css】清除浮动（clearfix 和 clear）的用法
本文主要是讲解如何在 html 中使用 clearfix 和 clear,针对那些刚开始了解 css 的童鞋.关于 clearfix 和 clear 的样式在这里我就不写了,具体样式点击此处. 下面就 ...
- 【CSS】clear清除浮动
clear清除浮动1.作用: 规定元素的某一侧不允许存在浮动元素 2.值: 3.应用: 清除其他浮动元素对其产生的影响 <!DOCTYPE html> <html lang=&quo ...
- 【css】清除浮动的几种方式
[css]清除浮动的几种方式 因为浮动框不在普通的文档流中,所以它不占据空间.如下面的代码: .news { background-color:gray; border:1px solid bla ...
- CSS——如何清除浮动
众所周知,平时在写HTML代码时,难免少不了使用Float样式,这样一来,假使您没有清除浮动,那么有浮动元素的父元素容器将元素将无法自动撑开.换句简单好理解的话来说,假如你在写CODE时,其中div. ...
- HTML&CSS基础-清除浮动
HTML&CSS基础-清除浮动 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.查看浮动效果 1>.HTML源代码 <!DOCTYPE html> &l ...
- day68-CSS-float浮动，clear清除浮动，overflow溢出
1. float 浮动 1.1 在 CSS 中,任何元素都可以浮动. 1.2 浮动元素会生成一个块级框,而不论它本身是何种元素.内联标签设置浮动,就变成了块级标签. 1.3 关于浮动的两个特点: 浮动 ...
- CSS中清除浮动的两种方式
在CSS中,父元素中的子元素如果使用了float,会导致父元素塌陷,高度为0. 对于这种情况,常见的解决方式有两种. 一.增加新的div,应用clear:both属性 html: <div cl ...
- 关于CSS中清除浮动的方法
在使用CSS样式时会经常使用到浮动(float),这时如果没有清除浮动就会造成很多怪异的现象,因此对父级元素清除浮动是必须要做的,这样也是书写CSS的一个良好习惯. 目前常用的方法大致有三种. (1) ...
随机推荐
- 简单的androidStudio 添加Jar包
感谢http://blog.csdn.net/ta893115871/article/details/46955791博主的文章, 1新建一个空项目 2在项目下添加一个新的moudle 3在该moud ...
- Web前端开发：为何选择MVVM而非MVC
在Web中充斥着所谓的MVC框架,而在我看来,因为一些关键性的技术原因,MVC在Web前端开发中根本无法使用(对的,是无法,而不是不该) 在Web中充斥着所谓的MVC框架,而在我看来,因为一些关键性的 ...
- c++ oop
C ++语言的主要优势之一是与其前身语言C不同的是,它被设计为支持面向对象编程(OOP). 这是一个相当简单的概念:你将操纵不同的对象,每个对象都是一个特定类的实例. 类是一组方法(绑定到这个类的函数 ...
- JSP开发模式1（简单注册功能）
———————————————————————————————————————————————— import java.util.regex.Matcher;import java.util.reg ...
- Python——函数中的关键字参数
关键字参数 可变参数允许你传入0个或任意个参数,这些可变参数在函数调用时自动组装为一个tuple.而关键字参数允许你传入0个或任意个含参数名的参数,这些关键字参数在函数内部自动组装为一个dict.请看 ...
- Activity之间传递参数（三）
------siwuxie095 传递值对象,即自定义的有数据类型的对象 1.首先 new 一个 class:User,用于创建自定义对象,同时右键 Generate 出 Constructor.se ...
- 拼图 canvas分割 dom拖拽 pc 移动端
参考:Canvas drag 实现拖拽拼图小游戏 参考的案例,不支持手机端.总结下实现过程中遇到的小坑. gitHub:https://github.com/WppFrontEnd/puzzle 大概 ...
- Android开发学习笔记：浅谈显示Intent和隐式Intent
原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://liangruijun.blog.51cto.com/3061169/655132 ...
- （二）catalina.bat
startup.bat在最后调用catalina.bat,并且传递了start参数,设置了CATALINA_HOME和CURRENT_DIR俩个临时环境变量.那么catalina.bat都做了什么? ...
- 【笔记】Android项目添加项目引用方法
刚才在做phoneGap时,想试图自己添加phoneGap的lib组件(jar的源码),找了好多种方法,下面这种成功了 项目邮件 Properties, Android ,Add... ,然后Dep ...