display:none和visibility:hidden的区别

1. display:none是彻底消失不在文档流中占位，也不会解析该元素。visibility:hidden的区别是视觉上消失了，可以理解为透明度为0的效果在文档流中占位，浏览器会解析该元素。
2. 使用visibility:hidden的效果比display:none的效果要好。display:none切换显示时visibility，页面显示回流（当页面中的一部分元素需要改变布局、显示隐藏时，页面重新构建这就是回流，所有页面加载时都要产生一次回流）而visibility切换是否显示时都不会有回流