display属性是CSS中用来控制布局的重要属性。其决定元素如何来显示。该属性有如下4中常用的取值，当然肯定不只这4种：
none - 当取值为none，等于让该元素完全消失（不会占据网页空间）inline - 定义一个行内元素，且该元素的width属性和height属性不会起任何作用block - 定义一个块级元素，该元素首末都会另起一行，该元素会占据整行宽度inline-block - 定义一个行内块级元素，类似行内元素，但该元素的width和height是可以设置的并非所有HTML元素的display属性的默认取值都是一致，但大多都是block或者inline，具体是哪个则视具体的元素类型而定。比如默认情况下<p>元素的display属性取值block，而<span>元素的display属性则取值inline属性。
块级元素的特点就是起始都会另起一行，且该元素会占据整行宽度。如下所示：
默认设置下，常见的块级元素有：
行内元素就是不需要另起一行，直接行内显示，所占宽度根据内容需要，且无法对其设置width与height属性。
默认设置下，常见的行内元素有：
通过设置display:none;可以让一个元素消失；对该元素修改属性，将其display属性改成其他可以显现的取值，如block，即可重新显示。
<p id="qingming">清明</p> <p style="display:none;" id="fanfu">反复</p> <p id="chongyang">重阳</p>
CSS中有两个属性都可以用来隐藏元素。但是这两种方式有一些细微的差别。
方式一：display:none
这种方式可以让元素完全消失，就像完全不存在一样；元素从有到无，页面的布局会发生变化。（花木兰代父从军，有一天，将军让士兵们排成一队，将军发现花木兰了，将军勃然大怒，决定让花木兰消失，花木兰消失后，将军喊了一句向右看齐，然后重新列队，花木兰原有的位置就被别的士兵补上了，重新列队的队伍完全看不出曾经有个花木兰，于是一切平安）
h1.hidden {
display: none;
}
方式二：visibility:hidden
这种方式也可以隐藏元素，但是不一样的是，只是这个元素看不见了，但是其所占空间依然存在，页面布局会保持不变。（花木兰代父从军，有一天，将军让士兵们排成一队，将军发现花木兰了，将军勃然大怒，决定让花木兰消失，花木兰消失后，将军就去打王者荣耀了，打完王者荣耀，将军又通宵吃鸡去了，而队伍依然没有解散，士兵各自保持原有位置，花木兰虽然消失了，但是她原来的那个位置依然是空着在，元帅路过，发现这里有个空白，就去深入调查了，后来这个将军就被元帅惩罚了）
h1.hidden {
visibility: hidden;
}