控制显示与隐藏元素

css： 设置opacity：0；隐藏，为1 完全显示
html
显示与隐藏的几种方式

display
	none : 无 隐藏元素
	block : 显示 转换为块级元素
visibility
	visible ：显示
	hidden ：隐藏

diaplay和visibility区别 ：

1、空间占据

display: none; 是彻底消失，不在文档流中占位，浏览器也不会解析该元素

visibility:hidden; 是视觉上消失了，可以理解为透明度为0的效果，在文档流中占位，浏览器会解析该元素；

使用visibility:hidden比display:none性能上要好，display:none切换显示时，页面产生回流（当页面中的一部分元素需要改变规模尺寸、布局、显示隐藏等，页面重新构建，此时就是回流。所有页面第一次加载时需要产生一次回流），而visibility切换是否显示时则不会引起回流。

2、子元素继承

display:none 不会被子元素继承，但是父元素都不在了，子元素自然也就不会显示了，皮之不存，毛之安附~~

visibility:hidden 会被子元素继承，可以通过设置子元素visibility:visible 使子元素显示出来

opacity: 0 也会被子元素继承，但是不能通过设置子元素opacity: 0使其重新显示

3、事件绑定

display:none 的元素都已经不再页面存在了，因此肯定也无法触发它上面绑定的事件；

visibility:hidden 元素上绑定的事件也无法触发；

opacity: 0元素上面绑定的事件是可以触发的。

4、过渡动画

transition对于display 肯定是无效的；

transition对于visibility 也是无效的；

transition对于opacity 是有效。

overflow
	hidden :溢出的部分隐藏掉
	visible : 显示
	auto ：自动出现滚动条
	scroll ：一直有滚动条

jquery

$("#id").show()  //表示为display：block，显示
$("#id").hide()  //表示为display:none;隐藏