qq_45775897的博客

一、为什么要消除浮动由于父级盒子很多情况下，不方便给高度，但是子盒子浮动又不占有位置（可以理解为飘浮），最后父级盒子高度为 0 时，就会影响下面的标准流盒子。由于浮动元素不再占用原文档流的位置，所以它会对后面的元素排版产生影响。二、清除浮动的本质清除浮动的本质是清除浮动元素造成的影响。如果父盒子本身有高度，则不需要清除浮动。清除浮动之后，父级就会根据浮动的子盒子自动检测高度。父级有了高度，就不会影响下面的标准流了。三、清除浮动清除方法方法额外标签法也称为隔墙法，是 W3C 推荐的

行内元素1.水平居中原始代码：<div class="parent"> <span class="child">content</span> </div>.parent{ width: 400px; height: 100px; background-color: antiquewhite; } .child{

<div class="grid"> <span style="background-color: aqua;">1</span> <span style="background-color: rgb(105, 177, 38);">2</span> <span style="background-color: rgb(21, 32, 196);">3</span>

一、flex布局体验UL： ul{ padding: 0;/* 加上这个 */ display: flex; width: 100%; height: 100px; background-color: antiquewhite; } li{ flex: 1; text-align: center;

特别声明：这篇博客转载于阮一峰老师，转载是为了方便日后复习，实在写的太棒了。 一、概述 网格布局（Grid）是最强大的 CSS 布局方案。 它将网页划分成一个个网格，可以任意组合不同的网格，做出各种各样的布局。以前，只能通过复杂的 CSS 框架达到的效果，现在...