网站建设得花多少钱,黑色网站模板,王烨楠,湖南移动网站建1、为什么要清除浮动#xff1f; 为了解决块级元素浮动后父元素塌陷问题。
2、为什么会产生 父元素塌陷#xff1f; 首先父元素没有设置高度#xff0c;父元素的高度是由子元素中最高的控件决定#xff0c;撑开 简单可以这样理解#xff0c;原本是在和父元素在同一层级上…1、为什么要清除浮动 为了解决块级元素浮动后父元素塌陷问题。
2、为什么会产生 父元素塌陷 首先父元素没有设置高度父元素的高度是由子元素中最高的控件决定撑开 简单可以这样理解原本是在和父元素在同一层级上。当子元素浮动后这样子元素会浮在父元素上面不在占据父元素的空间。原本是可以撑开父元素结果就不在被撑开。
3、怎么解决父元素塌陷问题 下面会使用例子的形式提供三种 解决父元素塌陷问题。
css 代码
style/* 3. 清除浮动 */.clearfix:after {visibility: hidden;clear: both;display: block;content: .;height: 0;}/* 清除浮动 *//* .clearfix {*zoom: 1;} */.father {width: 400px;border: 1px solid red;/* 1、解决父亲塌陷问题 直接给父元素设置 height *//* height: 100px; *//* 2、给父元素设置 float *//* float: left; */}.son {width: 100px;height: 100px;background-color: aqua;}/* 浮动会导致父亲塌陷 */.left {float: left;}.right {float: right;}html代码 div classfather clearfixdiv classson left/divdiv classson right/div/div建议使用 clearfix 类进行清除浮动。
清除浮动可能还有其他方法这里仅供自己学习期间总结。
