CSS隐藏元素的方法和区别

1.display：none

特点：设置该属性的元素会在页面上消失，会引起页面的回流与重绘，无法响应点击事件，不占据空间。

2.visibility：hidden

设置该属性的元素，dom结构依然存在，元素还占据空间，不会引起页面的回流，无法响应点击事件。

3.opacity：0（设置元素透明度）

这是一种变相隐藏元素的方法，通过设置元素透明，使之不可见。其实元素还在页面上。这种方法可以响应点击事件，不会引起页面回流，可以响应点击事件。

4.设置宽高为0

设置元素宽高为0，那么元素就消失了。这种方法会引起页面回流，无法响应点击事件。

5.设置position：fixed

通过固定定位，将元素定位到页面之外，使之不可见。该方法无法响应点击事件，会引起页面的回流。