隐藏任何HTML标记的正确方法是什么？

Question

什么是适当的CSS隐藏任何HTML.示例 - 类似<div>标签.我用来做这个:

div {display:none; visibility:hidden;}

CSS是否支持所有主要浏览器隐藏该div.特别是它支持IE

Answer 1

使用visibility: hidden;如果你仍然想要的元素占用空间的页面布局.例如:

Hello
<div style="visibility: hidden; height: 100px;">Hidden</div>
World

您仍将在两段文本之间看到100px,但您将看不到div中的内容.

使用:

Hello
<div style="display: none; height: 100px;">Hidden</div>
World?????

两个文本元素之间没有空格,因为它们div根本不会影响布局.

您可以想到的任何现代浏览器都支持这两种版本.

Answer 2

双方display:none并visibility:hidden得到普遍的支持CSS的浏览器所支持,所以只是一般的CSS警告略施.在具有不同的效果:display:none使得仿佛元件均未出现在所有的文件将被渲染,而visibility:hidden意味着该元件将适当格式化文档时,通常占据一定的空间,如同其被导通处理,但是从视图中移除完全透明.

您使用哪一个取决于您隐藏元素的目标.例如,如果您动态地(使用客户端脚本)关闭或打开某些内容,那么visibility:hidden可以更好,因为它不会导致重绘其他内容.

同时使用通常是没有意义的,为display:none使visibility:hidden不相关的(尽管在级联,它可能发生,你对这些属性设置可能会被其他样式表覆盖,然后display:none可能会失去作用).

Answer 3

你甚至不需要visibility:hidden;.

div {
    display:none;
}

以上应该足够了.它适用于所有浏览器.它几乎完全隐藏了元素,因为它将不再对页面布局产生影响.