元素显示类型-快元素、行内元素、行内快元素、盒子模型以及元素类型相互转换

🎸元素（标签）显示类型分为：快元素、行内（内联）元素、行内快元素

🎸下面是它们的特点介绍： 

1.快标签

🎸 块元素的标志是：

块元素的代码后台界面都会显示：display：block；/display：list-item；属性

代码后台在：随便一个网页，点击右键--点击检查--找到左上角有一个像这样的箭头标志，点击箭头选择网页中你想看的地方，就能在Elements界面及下面的styles界面看到相应的代码情况

🎸注意一点：p标签里可以放文本，但不能嵌套快级标签（元素）

 

2.行内（内联）标签

代码演示：

 结果：

 结果发现这些标签就是可以在一行显示的，这就是行内元素的特点：可以在一行显示内容

行内元素的标志是：代码后台都有一个display：inline的属性

3.行内快元素

特性是既能像块元素一样设置宽和高，也能像行内元素一样允许在一行中显示，所以这种同时具备了块元素和行内元素特点的元素（标签）被称为行内快元素。

行内快元素的标志是：display：inline-block；属性

4.盒子模型

块元素和行内快元素可以设置内外边距和边框，盒子模型有的特性都可以设置

行内元素只能设置边距的左右边距，不能设置上下边距

5.元素类型间的转化

想让三种类型在一起转化，直接加上对应的代码标志即可；

例如快元素想转换为行内元素，直接在style里面加上display：inline；想转换成行内快元素，直接加上display：inline-block；其他的同理

代码演示：

6.display：none属性的运用

 对于display属性还有一个属性值：display：none；也用的很多，可以实现当你鼠标放在父标签身上时，子标签显现，不放是子标签隐藏

就像京东网页这样：

  代码演示：

 结果：