css（2022/4/24）

div元素：块级元素，下一个div元素就会生成在它的盒子下面
可以设置高度宽度并独占一行
常用的块级元素：div、p、h1-h6，ul，ol，dl

行内元素
特点：文字并排显示，不能设置盒子宽度和高度
span、a、b、u、i等

行内块元素
特点：可以设置宽度和高度，并且盒子可以并排显示
常见行内块元素：input、img、table

---

display：设置css属性切换

block：表示标签要以块级元素加载（div的原模式）

inline：并排显示，将标签以行内形式加载

inline-block ：将标签以行内块元素加载

浮动：专门用于进行网页并排布局
（脱离标准文档流，不再受元素限制，又可以设置宽高）
float：设置元素浮动
设置left或right实现页面的浮动
浮动的特性：元素会按照书写的顺序依次贴边，同一个夫盒子可以设置左浮动或者右浮动

浮动的元素脱标
浮动元素脱离标准流后，既可以设置宽度和高度，也可以实现并排显示，不区分元素状态，也就是不区分行内元素和块级元素
（例如本不可以设置宽高的span标签设置浮动后可以设置宽高）
兄弟元素一个浮动，另外的都必须浮动。
若此时p标签和span标签都没有设置宽度和高度，元素的宽度会被内容撑宽，不会自动撑满父盒子。

浮动元素的依次贴边
1.如果父盒子的宽度不够，子盒子会依次贴边，但如果前面元素中有空隙，不会出现钻空的现象，而只会查询剩余宽度实现依次贴边
2.如果子盒子的宽度大于父盒子，会有溢出状态

浮动元素的margin塌陷
浮动元素没有了标准流的margin塌陷现象，各有各的margin，不会相互塌陷

浮动元素让出标准流
标准流中的元素都有自己的一个标准流位置，后面的元素只能在前面元素的后面进行加载，浮动元素脱离了标准流，它会让后面的元素占有自己的位置，显示效果上放佛是自己飘起来了，我们称之为脱标。