隐藏页面元素的几种方法

• 1.透明度opacity:0 （只有这个会响应交互！！！）

从视觉上隐藏元素，但元素仍占据它的位置，会响应用户的交互。

• 2.visibility:hidden

从视觉上隐藏元素，仍占据自己的位置，与opacity的唯一不同是，visibility不会响应用户的交互。

不会引起reflow，只会repaint。

• 3.display：none 不可见，不在文档中占据位置。

涉及到DOM结构的改变，所以会引起reflow 与 repaint。

• 4.position:absolute

把元素放到用户看不到的地方

• 5.clip-path剪裁路径

clip-path: polygon(0px 0px,0px 0px,0px 0px,0px 0px);/polygon是多边形函数，里面就是多边形的顶点坐标/

占据位置，但不响应用户交互。

clip-path用法参考：clip-path的用法