display: none ,visibility: hidden,opacity:0的区别

96
吴天乔
2016.10.17 23:36* 字数 112

display: none,visibility: hidden,opacity:0均用于隐藏元素。
三者的区别

  • display:none让元素消失,脱离文档流
  • visibility: hidden让元素隐藏,还在文档流中,占用空间,相当于透明化了
  • opacity:0透明度为0,即完全透明,还在文档流中,占用空间。与visibility: hidden的区别是opacity可设置不同程度的透明度
学习笔记