浮动元素会脱离文档流，向左/向右浮动（float:left||right），直到碰到父元素或另一个浮动元素；可能会有覆盖普通元素的风险，若普通元素在浮动元素之后，就会被覆盖，因为浮动元素不占正常文档流位置，普通元素移动到浮动元素的位置，被浮动元素覆盖； clear清除浮动：clear属性不允许被清除 ...
分类：
其他好文 时间：
2020-04-25 09:14:10
阅读次数：
72
z-index它有四大特性，每个特性你记住了，页面布局就不会出现找不到盒子的情况。 z-index 值表示谁压着谁，数值大的压盖住数值小的， 只有定位了的元素，才能有z-index,也就是说，不管相对定位，绝对定位，固定定位，都可以使用z-index，而浮动元素不能使用z-index z-index ...
分类：
Web程序 时间：
2020-04-21 15:32:23
阅读次数：
67
浮动元素的四大特性： 1.浮动的元素脱标（脱离标准文档流） 2.浮动的元素互相贴靠 3.浮动的元素由"子围"效果 4.收缩的效果 清除浮动的四种方法： 给父盒子设置高度 clear:both 伪元素清除法 overflow：hidden 伪元素清除法： div::after{ display: bl ...
分类：
Web程序 时间：
2020-04-21 15:29:42
阅读次数：
89
高度自适应第一种情况 1.高度不去设置，或者高度设置auto 内容撑开父元素的高度。2.内容撑开父元素的高度 -> 最小高度的设置 min-height3.浮动元素添加高度自适应 -> 添加浮动元素的父元素没有高度，会出现高度塌陷 解决高度塌陷的方法 (1)给出现高度塌陷的元素添加：overflow ...
分类：
其他好文 时间：
2020-04-21 13:05:46
阅读次数：
46
块格式化上下文 "块格式换上下文" ：（Block Formatting Content，BFC），页面中独立的块级渲染区域，该区域有一套渲染规则，用来约束块级盒子的布局，与本区域外无关。 触发BFC的条件 1. 浮动元素 2. overflow: hidden/auto/scroll 3. 绝对定 ...
分类：
其他好文 时间：
2020-04-09 01:03:15
阅读次数：
82
CSS Float(浮动) 什么是 CSS Float（浮动）？ CSS 的 Float（浮动），会使元素向左或向右移动，其周围的元素也会重新排列。 Float（浮动），往往是用于图像，但它在布局时一样非常有用。 元素怎样浮动 元素的水平方向浮动，意味着元素只能左右移动而不能上下移动。 一个浮动元素 ...
分类：
移动开发 时间：
2020-04-08 09:21:52
阅读次数：
512
css盒模型是网页布局中不可或缺的部分，以下是对css盒模型简要介绍的思维导图： 注：margin常出现的bug： a：当父元素和子元素都没有设置浮动的情况下，如果给第一个子元素添加margin-top 会错误的把margin-top加在父元素上 b：上下相邻两个元素之间的margin值，不会叠加， ...
分类：
Web程序 时间：
2020-04-01 01:21:47
阅读次数：
319
元素添加浮动后，会处于一个半脱离文档流的状态，如果没有给浮动元素的父元素设置固定的高度，那么父元素会认为没有内容撑开自己，因此父元素的高度为0，此时下面的元素会上来，被浮动元素压在下面。 解决方案： 1.给父元素设置固定的高度（父元素会缺乏灵活性，不能靠其内容自由变换撑开高度） 2.给父元素设置ov ...
分类：
其他好文 时间：
2020-03-31 19:18:06
阅读次数：
60
浮动元素的脱标（脱离标准流） <style type="text/css"> .box1{width: 100px;height: 100px;background-color: aqua; float: left; } .box2{width: 150px;height: 150px;backgr ...
分类：
Web程序 时间：
2020-03-23 15:04:39
阅读次数：
70
清除浮动 当元素有浮动属性时，会对其父元素或后面的元素产生影响，会出现一个布局错乱现象，可以通过清除浮动的方法来解决，浮动元素的影响浮动的清理（clear） 值： none：默认值。允许两边都可以有浮动对象 left：不允许左边有浮动对象 right：不允许右边有浮动对象 both：左右两侧都不允许 ...
分类：
其他好文 时间：
2020-03-22 14:00:18
阅读次数：
62
