display 属性是用于控制布局的最重要的 CSS 属性。
块级元素（block element）
块级元素总是从新行开始，并占据可用的全部宽度（尽可能向左和向右伸展）。
块级元素的一些例子：
- <div>
- <h1> - <h6>
- <p>
- <form>
- <header>
- <footer>
- <section>
行内元素（inline element）
行内元素的一些例子：
- <span>
- <a>
- <img>
Display: none;
display: none; 通常与 JavaScript 一起使用，以隐藏和显示元素，而无需删除和重新创建它们。如果您想知道如何实现此目标，请查看本页面上的最后一个实例。
默认情况下，<script> 元素使用 display: none;。
隐藏元素 - display:none 还是 visibility:hidden？
通过将 display 属性设置为 none 可以隐藏元素。该元素将被隐藏，并且页面将显示为好像该元素不在其中：
<style>
h1.hidden {
display: none;
}
</style>
<h1>这是一个可见的标题</h1>
<h1 class="hidden">这是一个隐藏的标题</h1>
<p>请注意， display: none; 的标题不会占用任何空间。</p>
效果：
visibility:hidden; 也可以隐藏元素。
但是，该元素仍将占用与之前相同的空间。元素将被隐藏，但仍会影响布局：
<style>
h1.hidden {
visibility: hidden;
}
</style>
<h1>这是可见的标题</h1>
<h1 class="hidden">这是隐藏的标题</h1>
<p>请注意，隐藏的标题仍然占据空间。</p>
效果：
