05默认显示类型与显示类型转换
（1）显示样式
显示样式（display），是W3C规定浏览器采取哪种盒模型规则来显示一个元素，常用显示样式的值有：
block（块级盒模型）
inline（行内盒模型）
inline-block（行内块级盒模型）
行内块级盒模型（inline-block box moldel）:让一个元素拥有块元素的宽高、边距、边框等特性的同时，还拥有垂直居中对齐，文本对齐方式等文字的特性。
关于默认显示类型：在前端诞生之初，只有HTML没有CSS，为了保证这些HTML标签展示的内容能够给用户提供较高的可读性，浏览器自己默认设置了一些排版规则，这些规则就是默认样式的前身。
（2）显示类型转换
????块级元素特性：block: (div/p/dl/form/h1-h6/ol/ul)
1. 独占一行
2. 高度由里面的元素撑开
3. 宽度默认100%(继承父元素宽度)
4. 可以设置外边距/内边距
5. 可以包裹其他任意元素
6. p标签不可包裹块级元素(只存放文本)
????行内元素特性：inline: (a/b/em/i/img/span)
1. 和其他行内元素处于同一行
2. 不支持宽高
3. 上下外边距无效，auto无效(不支持auto居中)
4. 内边距只对内联元素产生影响，无视块元素
5. 标签之间的空格解析
6. a标签能包裹块级元素(特殊、区域链接)
????行内块元素特性(集合两种盒模型的特征)：inline-block: (input)
1. 本质上是行内元素，具有行内元素的性质
2. 支持宽高
3. 上下外边距有效,auto无效(不支持auto居中)
4. 内边距只对内联元素产生影响，无视块元素
5. 标签之间的空格解析
6. img标签不是行内块元素(是行内元素,但是可以设置宽高，这源自于历史…)
当使用行内块元素（即dispaly：inline-block;）时，如果行内有空白或回车，浏览器会解析为空格，形成间距。解决方法有三种：
1. 给行内块元素父级设置字体大小为零，行内块元素字体大小重新设置
2. 删除标签之间空格
3. 从根本解决问题（不要使用）
（3）元素的显示与隐藏
①display:none 与 display:block
display: block有显示的意义； display: none隐藏不显示。
display: none：
1.不占据空间（如同消失一般），无法点击交互
2. 内部子元素也不会显示
3. display为none的元素浏览器不会渲染
②visibility：hidden 与 opacity：0
都占据空间，但都不显示。visibility不可以实现交互，而opacity可以实现交互。
③溢出隐藏
默认值：overflow:visible;
溢出隐藏:overflow: hidden;
文字超出时才会显示滚动条：overflow: auto;
文字超不超出都显示滚动条：overflow: scroll;
分别设置横纵滚动条：overflow-y: scroll; overflow-x: hidden;
(4)默认样式清除
去除列表前边的点：list-style:none
去除超链接的下划线：text-deraction:none;