1、在文档流中，父元素的高度默认是被子元素撑开的，当子元素浮动以后，子元素脱离文档流，此时将导致子元素无法撑起父元素的高度，导致父元素的高度塌陷。2、由于父元素塌陷，则父元素下的所有元素向上移动，导致页面布局混乱。3、根据w3c的标准，页面中元素都有一个隐含的属性叫Block Formatting Context简称BFC（IE6及以下版本不支持），该属性可以设置打开或关闭，默认为关闭，当开启以后
不加浮动，加了浮动，出现高度塌陷解决办法###给父元素添加height<!DOCTY
原创
2022-12-21 10:24:16
77阅读
BFC解决高度塌陷 定义：BFC（Block Formatting Context）全称是块级格式化上下文，用于对块级元素排版，默认情况下只有根元素（body）一个块级上下文，但是如果一个块级元素设置了float:left,overflow:hidden或position:absolute样式，就会
原创
2022-06-16 17:40:08
275阅读
.box1{ /* * 为box1设置边框 * 宽度和父
原创
2023-01-11 20:21:54
96阅读
一、高度塌陷 二、解决高度塌陷方案一 三、清楚浮动 四、解决高度塌陷方案二 五、解决高度塌陷方案三
转载
2019-04-27 14:29:00
129阅读
2评论
.box1{ border: 1px solid red; } .box2{ *
原创
2023-01-11 20:29:11
70阅读
问题在使用iSroll v4插件时，无法滚动到底部，从源码得知最大滚动位置由maxScrollY决定。从源
原创
2023-06-28 14:11:38
389阅读
第一种方法 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title></title> 6 <style type="text/css"> 7 8 .box1{ 9 border: 10px red solid;
转载
2021-01-23 17:59:00
347阅读
2评论
问题概述：父元素在文档流中高度默认是被子元素撑开的，当子元素脱离文档流以后，将无法撑起父元素的高度，也就会导致父元素的高度塌陷父元素的高度一旦塌陷所有元素的位置将会上移，导致整个页面的布局混乱方法1 开启父元素的BFC或hasLayout1.1 BFC1.1.1 Block Formatting Context-块级格式化环境1.1.2 BFC是元素的隐含属性，默认是在关闭状态的1.1.3 可以通
转载
2021-05-05 12:57:46
146阅读
2评论
.box1{ border: 1px solid red; } .box2{
原创
2023-01-11 20:29:02
84阅读
.clearfix::before,.clearfix::after { /* 解决外边距折叠 */ content: ""; display: table; /* 解决高度塌陷 */ clear: both;}
原创
2022-02-03 17:28:04
268阅读
.box1{ border: 10px red solid;
原创
2023-01-11 20:29:27
80阅读
同学们在进行页面布局的时候，经常会使用到float浮动进行样式控制，但如果我们没有设置父元素的高度的时候使用浮动就会导致后面的子元素出现问题，也就是高度塌陷。
原创
2021-07-05 11:02:52
315阅读
文章目录定位的简介定位相对定位偏移量（offset）相对定位的特点绝对定位包含块水平方向的布局水平居中垂直方向的布局水平垂直居中固定定位粘滞定位几种定位的对比元素层级定位的简介想要实现传统方式.box2 { width: 200px; height: 200px; background-color: yellow; /* 左外边距、上外边距 */ margin-left: 200px; margin-top: -200px;}.box3 {
原创
2021-07-05 13:56:21
104阅读
文章目录定位的简介定位相对定位偏移量（offset）相对定位的特点绝对定位包含块水平方向的布局水平居中垂直方向的布局水平垂直居中固定定位粘滞定位几种定位的对比元素层级
定位的简介想要实现 传统方式.box2 { width: 200px; height: 200px; background-color: yellow; /* 左外边距、上外边距 */ margin-l
原创
2022-01-24 15:50:45
90阅读
文章目录高度塌陷BFCclearafterclearfix高度塌陷在浮动布局中，父元素的高度默认是被子元素撑开的当子元素浮动后，其会完
原创
2022-01-16 16:32:16
257阅读
文章目录高度塌陷BFCclearafterclearfix高度塌陷在浮动布局中，父元素的高度默认是被子元素撑开的当子元素浮动后，其会完全脱离文档流，子元素从文档流中脱离将会无法撑起父元素的高度，导致父元素的高度丢失父元素高度丢失以后，其下的元素会自动上移，导致页面的布局混乱BFCBFC（Block Formatting Context）块级格式化环境BFC是一个CSS中的一个隐含的属性，可以为一个元素开启BFC开启BFC该元素会变成一个独立的布局区域元素开启BFC后的特点：不会被浮
原创
2021-07-05 13:56:22
122阅读
什么是高度塌陷?父元素高度自适应，子元素float之后，造成父元素高度为0，称为高度塌陷。他的产生条件就是子元素浮动
如图
如图：方法一：为父元素设置高度给父元素添加固定高度，适合做高度固定的布局建议：不推荐使用，只建议高度固定的布局使用方法二：给父元素添加overflow:hidden优点：简单，代码少，浏览器支持好缺点：不能和position配合使用，因为超出的尺寸会被隐藏建议：在页面布局
转载“共享博客”原文http://www.sharedblog.cn/?post=132什么是高度塌陷？ 父元素高度自适应，子元素 float 后，造成父元素高度为0，称为高度塌陷问题。如何来解决高度塌陷？方案一：给父元素一个固定的高度缺点：给父元素固定高度违背了高度自适应的原则，不够灵活，不推荐使用。方案二：给父元素添加属性 overf...
原创
2021-06-09 11:07:42
690阅读
