{{CSS}}visibility与display的区别

有两种CSS属性可以用来改变文档元素的可见性，即visibility与display。属性visibility比较简单，设为hidden，就不显示元素，设为visible，就显示元素。属性display用途更多，它用于指定显示的元素的类型。它可以指定一个元素是块元素，内联元素，还是列表项目，等等。但当display属性被设置为none时，受影响的元素就不会显示出来，甚至根本不被放置。

visibility和display样式属性之间的区别在于，它们对于非动态定位的元素的影响。对于出现在常规布局流中的元素（position属性设置为static或relative），可以把visibility设置为hidden，使元素不可见，但仍会在文档布局中保留它的空间。这样的元素可以在不改变文档布局的情况下，反复隐藏或显示。但如果元素的display属性被设置为none，就不会在文档布局中为它分配空间，它两边的元素都会靠拢，就像它不存在一样（在使用绝对布局定位和固定定位的元素时，visibility和display属性的效果一样，因为这些元素都不是文档布局的一部分）。通常在使用动态定位元素时，可以使用visibility属性。在创建展开或折叠的大纲这样的元素时，用display元素比较有效。

注：除非想用JS动态设置visibility和display属性，使元素在某种情况下可见。