隐藏一个元素可以通过把display属性设置为"none"，或把visibility属性设置为"hidden"。但是请注意，这两种方法会产生不同的结果。
CSS可以通过为元素设置display:none;样式设置元素隐藏不占空间：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style>
div{width: 200px;
height: 100px;
border: 1px solid red;}
.display{display: none;}
</style></head>
<body>
<div>显示</div>
<div class="display">隐藏不占位</div>
<div>显示</div>
</body>
</html>
效果如下：
display:none可以隐藏某个元素，且隐藏的元素不会占用任何空间。也就是说，该元素不但被隐藏了，而且该元素原本占用的空间也会从页面布局中消失。
display属性：
display 属性规定元素应该生成的框的类型。
这个属性用于定义建立布局时元素生成的显示框类型。对于 HTML 等文档类型，如果使用 display 不谨慎会很危险，因为可能违反 HTML 中已经定义的显示层次结构。对于 XML，由于 XML 没有内置的这种层次结构，所有 display 是绝对必要的。
disp属性的几种可能值：
-
none 此元素不会被显示。
-
block 此元素将显示为块级元素，此元素前后会带有换行符。
-
inline 默认。此元素会被显示为内联元素，元素前后没有换行符。
-
inline-block 行内块元素。（CSS2.1 新增的值）
-
list-item 此元素会作为列表显示。
-
run-in 此元素会根据上下文作为块级元素或内联元素显示。
