display:none、visibility:hidden，opacity:0三者区别

控制元素的显示与隐藏：区分display:none、visibility:hidden，opacity:0

1. display:none

• 设置display：none，让这个元素消失
• 消失不占据原本任何位置
• 连带子元素一起消失
• 元素显示：display:block

2. visibility:hidden

• 元素消失，只是视觉消失，在页面中实际存在，对布局依然起作用
• 元素显示：visibility:visible

3. opacity:0

• opacity值为0代表透明度为0
• 元素完全透明，视觉上消失，页面实际存在，依然对布局起作用
• 0-1之间代表透明度，值为1则元素完全显示

本文来自博客园，作者：不知名前端李小白，转载请注明原文链接：https://www.cnblogs.com/libo-web/p/15365128.html