2021-05-16

**元素的分类：
**从显示分类，分为块元素，行内元素（内联元素），可变元素
块元素：
特点：1.直接设置大小
2.独占一行
3.可以嵌套任何标签，但是有一个除外p（一般不嵌套块元素，嵌套的是行内元素（不可以直接设置大小的）

行内元素：
特点：1.一般不能直接设置大小
2.不独占一行
3.一般行内元素嵌套行内元素，不嵌套块元素
4.行内元素一般情况下，不建议设置padding-top/bottom,margin-top/bottom,border-top/bottom

可变元素：根据上下文关系来确定是行内元素或块元素

行内块元素：可以直接设置大小，一行显示多个，本质上是行内元素

置换元素：
定义：浏览器根据元素的属性和属性值，来决定元素的具体显示内容，进而决定元素显示的大小。例如：input img textarea（特点：常见的是单标签,拥有固定的大小）

非置换元素：除置换以外的元素都是非置换元素。例如：a div span
p

应用：
转换元素类型：
display：属性值18个
display：block/inline/inline-block/table-cell(td/th)
img--------display:inline/inline-block

display:none-----元素消失
display:非none----元素显示

定位：
使用场景:
一个元素附在另一个元素的上面用定位。
分类：
绝对定位;absolute,脱离文档流，不占空间

倒三角箭头：
i标签：
css：
1.display：block;
2.width:5px;
height:5px;
3.border-left:2px solid red;
border-bottom:2px solid red;
4.旋转i标签，转换角向下
transform:rotate(-45deg)（角度为正，顺时针旋转）