一、BFC 的概念 1.规范解释 块格式化上下文（Block Formatting Context，BFC）是Web页面的可视化CSS渲染的一部分，是布局过程中生成块级盒子的区域，也是浮动元素与其他元素的交互限定区域。 2.通俗理解 BFC 是一个独立的布局环境,可以理解为一个容器,在这个容器中按照 ...
分类：
其他好文 时间：
2019-12-02 17:01:40
阅读次数：
111
一、伪元素的应用 1. 清除浮动 父元素中有子元素，并且父元素没有设置高度，子元素在父元素中浮动，结果必然是父元素的高度为 0，这也就导致了父元素高度塌陷，我们就需要清除浮动。 给浮动元素的容器添加一个 clearfix 的 class，然后给这个 class 添加一个 :after 伪元素实现元素 ...
分类：
其他好文 时间：
2019-12-02 00:34:49
阅读次数：
92
CSS(7) 通俗讲解清除浮动 上一篇讲了CSS浮动 博客地址： "CSS(6) 通俗讲解浮动(float)" 一、理解清除浮动 1、为什么要清除浮动 我们前面说过，浮动本质是用来做一些文字混排效果的，但是被我们拿来做布局用，则会有很多的问题出现。 由于浮动元素不再占用原文档流的位置，所以它会对后面 ...
分类：
Web程序 时间：
2019-11-19 00:44:09
阅读次数：
110
块元素在文档流中默认垂直排列，所以多个div从上至下依次排开如果希望块元素在页面中水平排列，可以使用float来使元素浮动，从而脱离文档流,元素脱离文档流以后，它下边的元素会立即向上移动css浮动的特性1.浮动的元素不会盖住文字，文字会自动环绕在浮动元素的周围2.元素浮动以后，会尽量向页面的左上或这是右上漂浮,直到遇到父元素的边框或者其他的浮动元素3.如果浮动元素上边是一个没有浮动的块元素，则浮动
分类：
Web程序 时间：
2019-11-17 13:05:14
阅读次数：
120
IE6的双倍边距bug 在IE6中，当为一个向左浮动的元素设置左外边距时，这个外边距将会是设置值的2倍 1，添加一个样式来解决ie6的双倍边距问题 对于一个浮动元素来说设置display：inline没有任何意义 但是该属性可以解决IE6的双倍边距问题 display:inline； 2，或者为IE ...
分类：
其他好文 时间：
2019-11-13 16:00:45
阅读次数：
71
块状格式化上下文（Block Formatting Context，BFC) MDN对BFC的定义：是Web页面的可视化CSS渲染的一部分，是块盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。 BFC是一个独立的渲染空间，只有块级元素参与，规定了内部元素如何布局，并且与这个区域外部的元素 ...
分类：
其他好文 时间：
2019-11-12 11:16:01
阅读次数：
89
BFC 块格式化上下文（Block Formatting Context），是web页面的可视化css渲染的一部分，是布局过程中生成块级盒子的区域，也是浮动元素与其他元素的交互限定区域。 通俗理解 BFC是一个独立的布局环境，可以理解为一个容器，在这个容器中按照一定规则进行物品摆放，并且 不会影响其 ...
分类：
其他好文 时间：
2019-11-11 12:43:40
阅读次数：
82
浮动： float 是我们网页布局的一种 浮动 可以有 left 左浮动 right 右浮动 两种 浮动的特点： 脱离正常的文档流，原本的空间不占据，浮动的标签都具有块级标签的一些特点，可以手动设置宽高 如果有相邻的多个浮动的元素，那么后面浮动的元素会停靠在前面浮动元素的后面，如果剩余空间不够，则会 ...
分类：
其他好文 时间：
2019-11-07 09:43:15
阅读次数：
79
一、设计网页的思想 拿到需求之后我们先对各个模块（盒子）进行划分，然后从外到内进行设计（1）设计一个盒子最基本的设计大致包括背景颜色（其实用于识别），宽，高，边界浮动流还是标准流. （2）然后盒子和盒子之间的外边距margin （3）然后在进入到小盒子中，进一步划分盒子，这样再重复第一二步 注意点： ...
分类：
Web程序 时间：
2019-11-03 01:15:25
阅读次数：
83
【学习原文自】https://www.cnblogs.com/shenfangfang/p/5278528.html 学习总结： 1.脱离文档流-部分无视：浮动的元素可以向左向右移动，直到他的外边缘碰到包含框或者另一个浮动框的边框为止。 浮动元素后跟block元素： 浮动的框之后的block元素会认 ...
分类：
其他好文 时间：
2019-10-29 21:20:04
阅读次数：
117
