元素类型：

元素类型：
元素类型分类：3类（面试）
块元素、行内元素、行内块元素
1、块元素
特点：能够设置宽高，自己独占一行
例如：div、p、h1-h6、ul、ol、dl、dt、dd、form、li
都有display属性，取值为block
2、行内元素
特点：默认横向排列，不支持设置宽高
例如：a、span、b、strong、i、em、u、s、del、sub、sup
都有display属性，取值为inline
注意：行内元素添加内边距、外边距，水平方向上生效，垂直方向上不生效
3、行内块元素
特点：默认横向排列，又可以设置宽高
例如：img、input、textarea（多行文本输入框）、select（下拉框）
都有display属性，取值为inline-block
注意：img标签display取值为inline，是特殊的行内块元素
思考：可以可以将不同的标签进行类型转换？
通过display属性来转换元素类型

            display属性
                取值：
                    常用取值：
                        block-----------------块元素
                        inline----------------行内元素
                        inline-block----------行内块元素
                        none------------------隐藏元素
                    不常用取值：（了解即可）
                        list-item----------列表形式
                        table--------------表格形式
                        table-row----------表格行
                        table-cell---------表格单元格
            如何将一个元素隐藏？
                1、display：none；-----------元素不占位置
                2、visibility:hidden;---------元素占位置
                3、opacity:0;-----------------元素占位置
                    取值：
                        数字0-1，0:表示透明，1:表示不透明
                4、height:0；-----------------元素不占位置
                5、transform：scale（0）（利用缩放）--------元素占位置
            特殊的行内块元素素
                img下面三像素留白问题
                    1、display:block-------改变图片元素类型（本质问题）
                    2、图片标签基于基线对齐，只要不让图片基线对齐就可以解决这个问题
                        需要调整图片垂直对其方式
                        vertical-align:
                            取值：
                                top-------顶线对其
                                middle-------中线对其
                                baseline-------基线对其（默认值）
                                bottom-------底线对其
                    让一张图片在容器中实现垂直居中
                        1、容器有高
                            height：200px;
                        2、容器有行高
                            line-height：200px;
                        3、调整图片垂直对齐方式
                            vertical-align：middle;
            思考：如何将一个元素变成块元素？(面试题)
                1、display：block
                2、给元素添加浮动
                    float：left/right
                3、给元素添加定位
                    position:absolute(绝对定位)/fixed（固定定位）
                4、父子关系中，父元素触发弹性盒子，子元素变成块元素
                    父元素：display：flex