# 介绍 CSS 隐藏页面中某个元素的几种方法
Issue
欢迎在 Gtihub Issue 中回答此问题: Issue 452 (opens new window)
Author
CSS 方法一:
display:none
CSS 方法二:
position:absolute;top:-1000px;left:-1000px;
Author
更多的隐藏方案可查看: 10 Ways to Hide Elements in CSS (opens new window)
# 01 display: none
通过 CSS 操控 display,移出文档流
display: none;
# 02 opacity: 0
透明度为 0,仍在文档流中,当作用于其上的事件(如点击)仍有效
opacity: 0;
# 03 visibility: hidden
透明度为 0,仍在文档流中,但作用于其上的事件(如点击)无效,这也是 visibility:hidden
与 opacity: 0
的区别
visibility: hidden;
# 04 content-visibility
移出文档流,但是再次显示时消耗性能低
content-visibility: hidden;
# 05 绝对定位于当前页面的不可见位置
position: absolute;
top: -9000px;
left: -9000px;
# 06 字体大小设置为 0
font-size: 0;