display属性规定元素生成框的类型，默认值inline。
属性值有很多，但常用且支持度较好的就那么几个。
block
block元素当不设置宽度时，宽度为父元素的宽度，独占一行，支持设置宽高、外边距、内边距。不支持CSS的vertical-align属性
标签：
<address> <article> <aside>
<blockquote> <body> <dd> <details> <div> <dl> <dt>
<fieldset> <figcaption> <figure> <footer> <form>
<h1> <header> <hr>
<html>
<legend>
<nav>
<ol>
<optgroup> <option>
<p>
<section>
<summary>
<ul>
inline
inline元素宽度由内容撑开，不独占一行，不支持设置宽高、上下margin、上下padding。
标签：
<a> <abbr> <area> <bdo> <br> <cite> <code> <del> <dfn> <em> <i> <ins> <kbd> <label> <map> <mark> <pre> <q> <rp> <rt> <ruby> <s> <samp> <small> <span> <strong> <sub> <sup> <u> <var> <wbr>
和文本相关的元素都是inline标签
inline-block
inline-block元素当设置宽度时，宽度由内容撑开。元素不独占一行，支持设置宽高、外边距、内边距。
标签：
<audio> <button> <canvas> <embed> <iframe> <img> <input> <keygen> <meter> <object> <progress> <select> <textarea> <video>
以上inline-block元素是指它们具有inline-block的特征，并非默认值就是display: inline-block。只有表单类元素是纯inline-block元素，audio、canvas、iframe、img、keygen、object、video都应该算是inline元素
none
none元素脱离文档流并隐藏自身。
标签：
<base> <link> <title> <datalist> <params> <script> <source> <style>
table
table元素不设置宽度时，宽度由内容撑开。独占一行，支持宽高、外边距、内边距。拥有表格的特征，可设置table-layout、border-collapse、border-spacing等表格专有属性。如果设置了border-collapse:collapse 设置padding将会无效
table-cell
tabel-cell元素不设置宽度时，宽度由内容撑开，不独占一行，可以设置宽高和内边距，不可以设置外边距。tabel-cell就像表格的td元素，td元素能设置padding，但是margin无效。
可以利用这点实现元素的垂直居中：
<style>
.t1 {
display: table-cell;
150px;
height: 150px;
background-color: green;
vertical-align: middle;
text-align: center;
}
<style>
<div class="t1">
<p>Hello World</p>
</div>