display:none;visibility:hidden;和opacity:0;的区别

Posted cz0017

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了display:none;visibility:hidden;和opacity:0;的区别相关的知识,希望对你有一定的参考价值。

display:none;

visibility:hidden;

opacity:0;

它们都可以让元素隐藏掉,但是它们之间还是有区别的

display:none;隐藏后不占空间

而另外两个虽然隐藏了元素,但是还是占据着空间

而transition对于display:none;和visibility:hidden;是无效的

但是对于opacity:0;是有效的

 

以上是关于display:none;visibility:hidden;和opacity:0;的区别的主要内容,如果未能解决你的问题,请参考以下文章

关于js控制display:none的问题

关于display:none和display:block的问题

display: none;visibility: hiddenopacity=0区别总结

display:none vs visibility:hidden

如何设置“style=display:none;”使用 jQuery 的 attr 方法?

jquery控制display属性为none或block