温故而知我不懂的CSS( 三 ) _CSS

IE模型不是一无所用，开发中我们有时候会改变padding的值，这样会影响到整个盒子的区域面积，我们还得手动计算改width或者height，这样显然影响效率，这时候IE盒模型的作用就来了，我们只要按照设计师给的盒子固定区域，写死，给我写死就行！！！,我们将盒子转化为IE盒模型，我们不管怎么改变padding或者border，区域面积永远固定在哪里

box-sizing:content-box /*（标准盒模型）*/box-sizing:border-box /*（IE盒模型）*/在ie8+浏览器中使用哪个盒模型可以由box-sizing(CSS新增的属性)控制，默认值为content-box，即标准盒模型；如果将box-sizing设为border-box则用的是IE盒模型。如果在ie6,7,8中DOCTYPE缺失会触发IE模式。在当前W3C标准中盒模型是可以通过box-sizing自由的进行切换的
CSS流的规则

“流”之所以影响了整个 CSS 世界，就是因为影响了 CSS 世界的基石 HTML 。那具体是如何影响的呢？

什么是格式化上下文（Fatting context）前面我们反复讲到的格式化上下文到底是什么东东？查阅了W3C得到的是这句话:Boxes in the normal flow belong to a formatting context意思是正常流的盒子属于格式化上下文，前面我们讲到不同格式化上下文(formatting context)下的盒子有不同的表现，我们知道正常流的盒子属于格式化上下文，那么格式化上下文就是制定规则的区域，那么大家想想，想到规则会想起CSS的谁？也就是流, 在我的理解里: 。FC就是我们的流，它是页面中的一块渲染区域，有一套渲染规则如何理解块级格式化上下文BFC(block formatting context)?,那么流中具有不同的规则，比如BFC、IFC、FFC、GFC,下面我们逐个击破它们吧
块级元素和内联级元素在讲块级元素和内联元素之前，我们会这样想块级元素：总是独占一行，表现为另起一行开始，而且其后的元素也必须另起一行显示,内联元素：和相邻的内联元素在同一行，的确可以这样理解，但是有没有想过就是这些元素为什么会具备这些属性？与其说具备这些属性，倒不如说HTML标签元素被不同的规则所影响，导致拥有不同的属性
HTML 常见的标签有<div>、<p>、<li>和<table>以及<span>、<img>、<strong> 和<em>等。虽然标签种类繁多，但通常我们就把它们分为两类：块级元素（block-level element）和内联元素（inline element）。

多年开发老码农福利赠送：网页制作，网站开发，web前端开发，从最零基础开始的的HTML+CSS+JAVAScript 。jQuery，Vue、React、Ajax，node，angular框架等到移动端小程序项目实战【视频＋工具＋电子书＋系统路线图】都有整理，需要的伙伴可以私信我，发送“前端”等3秒后就可以获取领取地址，送给每一位对编程感兴趣的小伙伴