【字节】介绍 CSS 隐藏页面中某个元素的几种方法 ​

更多隐藏方案可参考 10 Ways to Hide Elements in CSS

display: none; ​

通过 CSS 操控 display，移出文档流

display: none;

opacity: 0; ​

透明度为 0，仍在文档流中，当作用于其上的事件（如点击）仍有效

opacity: 0;

visibility: hidden; ​

透明度为 0，仍在文档流中，但作用于其上的事件（如点击）无效，这也是 visibility: hidden; 与 opacity: 0; 的区别

visibility: hidden;

content-visibility: hidden; ​

移出文档流，但是再次显示时消耗性能低

content-visibility: hidden;

绝对定位于当前页面的不可见位置 ​

position: absolute;
top: -9000px;
left: -9000px;

字体大小设置为 0 ​

font-size: 0;