display,visibility,opacity之间的区别

区别：

display:none;是将DOM元素设置为隐藏，该隐藏是不占位置的，HTML元素（对象）的宽度、高度等各种属性值都将“丢失”。

visibility:hidden;也是将DOM元素设置为隐藏，但是该隐藏仅仅是看不见而已，还是占位置的，也即是说它仍具有高度、宽度等属性值。

opacity:0;是将透明度设置为0，仅仅是看不见而已，还是占位置的。审查元素的时候还是可以找的到的。

延伸：

display的属性：block（默认值，设置为块级元素，独占一行），inline（设置为行内元素，不独占一行），none（设置为隐藏）

visibility的属性：visible（默认值，设置为可见），hidden（设置为不可见），inherit（继承上级的visibility），collapse（只对table有用）

opacity需要考虑兼容性问题，低版本的IE是filter:alpha(opacity=50);