说明

隐藏元素主要有三种方法(也可以用left: -9999px或者transform: translateX(-9999px);将元素移出视口外部。)

1.display: none;

2.visible: hidden;

3.opacity: 0;

下面从 占据空间 点击事件 子元素是否收到影响 三个方面进行对比

从占据空间角度对比

1:不占据空间

2:占据空间

3:占据空间

从是否响应点击事件角度对比

1:不可触发点击事件

2:不可触发点击事件

3:可以触发点击事件

从子元素是否受到影响(指子元素重新设置样式是否可以显形)角度对比

1:受到影响

2:不受影响

3:受到影响