要让一个元素全部隐藏掉且在文档流中不占位，应该使用下面哪个 CSS 规则？

这个题的答案是display: none

隐藏一个元素的方法有两种：dispaly:none，visibility:hidden

而他们之间的区别之一就是隐藏一个元素且在文档流中占不占位：

1.dispaly:none

        1）不为被隐藏的对象保留其物理空间。html对象在页面上彻底消失（display:none会让元素完全从渲染树中消失，渲染的时候不占据任何空间）。

        2）是非继承属性，子孙节点消失由于元素从渲染树消失造成的，通过修改子孙节点，属性无法显示。

        3）修改常规文档流元素的display通常会造成文档的重排（reflow）重绘（repaint）。

2.visibility:hidden

        1）为隐藏的对象保留其物理空间，html对象仅仅是在视觉上看不见（完全透明），而它所占据的空间位置仍然存在（visibility:hidden不会让元素从渲染树中消失，渲染树元素继续占据空间，只是内容不可见）。

        2）是继承，子孙节点消失由于继承了hidden，通过visibility:visible可以让子孙节点显示。

        3）修改visibility属性只会造成文档的重绘（repaint）。