文档章节

浮动和清除浮动

刘滕
 刘滕
发布于 2016/03/20 13:08
字数 250
阅读 14
收藏 0
浮动(float)
  1.float:left左浮动|right右浮动
2.
(1)浮动元素脱离文档流(不占位)
(2)浮动元素会碰到包含边框的边界或者另一个浮动元素才停止编辑
(3)块元素浮动并且没设置宽高,宽度于文本内容大小相同
(4)行元素浮动,脱离文档流后可以设置宽高(默认文档流下不能设置宽高)
(5)浮动元素对后面元素的影响是文本内容环绕
四.清除浮动
Clear:left左面清除浮动
      Right右面清除浮动
      Both两边清除浮动
高度塌陷原理:父元素中的子元素都浮动起来,并且父元素没有设置高度,父元素高度为0
解决方法
(1).clear{
clear:both
}
(2)万能清除(在父元素中添加clear样式)
     .clear{
        Clear:both
         zoom:1;}
.clear:after{
    display 显示:block 块;
    Content:‘.’;
    Clear:both;
    Height:0;
    Visibility:hidden;}


© 著作权归作者所有

刘滕
粉丝 3
博文 7
码字总数 4375
作品 0
成都
前端工程师
私信 提问
加载中

评论(1)

卧龙小
卧龙小
加油
CSS清除浮动_清除float浮动

CSS清除浮动方法集合 一、浮动产生原因 - TOP 一般浮动是什么情况呢?一般是一个盒子里使用了CSS float浮动属性,导致父级对象盒子不能被撑开,这样CSS float浮动就产生了。 浮动产生样式效果...

单线程生物
2016/04/07
88
0
CSS布局模型 之 浮动模型(浮动的工作原理和清除浮动技巧?)

浮动的工作原理 浮动是让某元素脱离文档流,在浮动框之前和之后的非定位元素会当它不存在一样,可能沿着它的另一侧垂直流动,但都为其腾出空间,块级元素也不例外(被浮动元素占据了部分行空...

艺晨光
2017/08/22
0
0
[转]CSS clear both清除浮动

本文转载于:猿2048网站[转]CSS clear both清除浮动 DIV+CSS clear both清除产生浮动 我们知道有时使用了css float浮动会产生css浮动,这个时候就需要清理清除浮动,我们就用clear样式属性即可...

前端老手
09/05
12
0
清除浮动的七种方式方法(实例代码讲解)

今天给大家分享的是清除浮动的具体代码实现,主要是帮助大家理解哪一种清除浮动比较好,辨析它们的优缺点而已。清除浮动有很多种,如何进行选择清除浮动呢?E良师益友网就拿下面的一个例子来...

罗马教堂的钟声
2015/12/22
88
0
前端开发笔记(3)css基础(中)

上一篇中我们学习了html的标准文档流,下面我们先来看看如何脱离标准流。 脱离标准流 css中一共有三种方法脱离标准流 浮动 绝对定位 固定定位 浮动 我们要搞清楚什么是浮动,先来看一个标准文...

lxq_xsyu
2016/11/18
0
0

没有更多内容

加载失败,请刷新页面

加载更多

nginx学习笔记

中间件位于客户机/ 服务器的操作系统之上,管理计算机资源和网络通讯。 是连接两个独立应用程序或独立系统的软件。 web请求通过中间件可以直接调用操作系统,也可以经过中间件把请求分发到多...

码农实战
今天
5
0
Spring Security 实战干货:玩转自定义登录

1. 前言 前面的关于 Spring Security 相关的文章只是一个预热。为了接下来更好的实战,如果你错过了请从 Spring Security 实战系列 开始。安全访问的第一步就是认证(Authentication),认证...

码农小胖哥
今天
10
0
JAVA 实现雪花算法生成唯一订单号工具类

import lombok.SneakyThrows;import lombok.extern.slf4j.Slf4j;import java.util.Calendar;/** * Default distributed primary key generator. * * <p> * Use snowflake......

huangkejie
昨天
12
0
PhotoShop 色调:RGB/CMYK 颜色模式

一·、 RGB : 三原色:红绿蓝 1.通道:通道中的红绿蓝通道分别对应的是红绿蓝三种原色(RGB)的显示范围 1.差值模式能模拟三种原色叠加之后的效果 2.添加-颜色曲线:调整图像RGB颜色----R色增强...

东方墨天
昨天
11
1
将博客搬至CSDN

将博客搬至CSDN

算法与编程之美
昨天
13
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部