BFC和清除浮动
1.清浮动(不考虑兼容的话这一项够用了):
.clear:after{
content:'';
display:block;
clear:both;
}
兼容ie6或7 加一个
.clear{
*zoom:1; //用来触发 haslayout(IE浏览器的BFC)
}
2.BFC (一套渲染机制)
触发BFC的方式(以下任意一条就可以)
1.float的值不为none
2.overflow的值不为visible
3.display的值为table-cell、tabble-caption和inline-block之一
4.position的值不为static或则releative中的任何一个
https://www.cnblogs.com/CafeMing/p/6252286.html
BFC和清除浮动的更多相关文章
- BFC之清除浮动篇&clear
我们在日常代码生活中,或多或少会利用浮动来布局,例如导航布局,如下图所示: 但是,我们在实现的时候,经常会遇到父元素“塌陷”以及清除浮动问题.例如 <!DOCTYPE html> < ...
- BFC清除浮动
BFC 就是清除浮动 用来处理文档脱离文档流的问题 清除浮动的方法: a.父元素也添加一个浮动 产生弊端就是:margin 不能使用 b.给父元素添加一个:display:inline-block 弊 ...
- 【Web】网页清除浮动的方法
网页中,经常用浮动的div来布局,但是会出现父元素因为子元素浮动引起内部高度为0的问题,为了解决这个问题,我们需要清除浮动,下面介绍4中清除浮动的方法. 在CSS中,clear属性用户清除浮动,语法: ...
- 详说 CSS 清除浮动
转自:http://kayosite.com/remove-floating-style-in-detail.html 浮动,从诞生那天起,它就是个特别的属性——既为网页布局带来新的方法,却又随之产生 ...
- CSS给元素清除浮动影响的方法,--最全四种方法
代码实例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...
- CSS——浮动及应用&清除浮动
浮动(float) 1.普通流(normal flow) 这个单词很多人翻译为 文档流 , 字面翻译 普通流 或者标准流都可以. 前面我们说过,网页布局的核心,就是用CSS来摆放盒子位置.如何把盒子摆 ...
- html-css:浮动_清除浮动
1.浮动 清除浮动之前我们首先需要了解为什么要清除浮动 1. 假设我们有一个父盒子,不设置高度,其高度有内部子盒子的大小自动撑开,这样是完全可行的,因为有时候我们并不想直接固定死父盒子的大小,而是根据 ...
- CSS系列,清除浮动方法总结
在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素.在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外 ...
- 【深入BFC】 关于CSS中float布局,清除浮动,和margin合并的原理解析,解开你心中的那些困惑!
BFC的通俗理解: Block Formatting Context(块级格式化上下文)是W3C CSS 2.1 规范中的一个概念,它决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用. ...
随机推荐
- apache_php_mysql
软件下载 目前,Apache和PHP均未出现官方的64位版本. Apache 64位: http://www.blackdot.be/?inc=apache/binaries 这个安装文件我已经上传到 ...
- PHP生成PDF文件。
<?php require_once('TCPDF/tcpdf.php'); //实例化 $pdf = new TCPDF('P', 'mm', 'A4', true, 'UTF-8', fal ...
- node环境
下载教程:http://www.runoob.com/nodejs/nodejs-install-setup.html 选择版本下载:https://nodejs.org/en/download/ 输 ...
- DRF框架之认证组件用法(第四天)
1. 什么是drf 框架的认证组件: auth 就等于是jango中的Auth模块,Auth是自带session信息,但是 drf的认证组件可以自定义token携带过去,去判断用的 2.如何实现认证呢 ...
- thinkphp5.1 使用success();和error();要注意的点
public function succ() { $this->success(); $this->error(); } 这里的$this-> 老是忘掉 记录一下
- 腾讯基于Kubernetes的企业级容器云平台GaiaStack (转)
GaiaStack介绍 GaiaStack是腾讯基于Kubernetes打造的容器私有云平台.这里有几个关键词: 腾讯:GaiaStack可服务腾讯内部所有BG的业务: Kubernetes:Gaia ...
- Windows终端工具_MobaXterm
前言 有人喜欢小而美的工具,有人喜欢大集成工具.这里推荐一款增强型的Windows终端工具MobaXterm,它提供所有重要的远程网络工具(SSH,X11,RDP,VNC,FTP,MOSH ..... ...
- 项目需求分析与建议-NABCD模型
N(Need 需求) 首先我们的创意解决了现有阶段学校查空余教师的问题,充分解决了同学们上自习却找不到教室的苦衷,同时也会适当的拓展一些适当的学习计时功能或者每日一语等等,来帮助同学们来控制好学习时间 ...
- to_char与to_date的区别
select * from csend where credttm > to_date('2018-06-11','yyyy-mm-dd'); select * from csend where ...
- tarjan求强连通分量
http://poj.org/problem?id=3180 //#include<bits/stdc++.h> #include<iostream> #include< ...