首页 > 其他 > 详细

visibillity和display:none产生的回流和重绘

时间:2021-06-12 00:45:32      阅读:23      评论:0      收藏:0      [点我收藏+]

visibility:hidden会保留元素的空间,仅为视觉上的完全透明(看不见、摸得着)
display:none不为被隐藏的对象保留其物理空间(看不见摸不着)

何为重绘(repaint)
repaint发生的时候,元素的外观会被改变,且在没有改变布局的情况下发生,如改变:
outline、visibility、backgroundcolor
不会影响到dom结构的变化,此时只发生repaint
何为渲染(reflow)
峪repaint的区别在于他会影响到dom结构的渲染,同时会触发repaint,会改变本子和所有父辈元素(祖先),这种开销很昂贵,会导致性能下降,而且页面元素越多,效果约明显。

在这里,display:none会发生reflow;而visibility:hidden只会触发repaint。

visibillity和display:none产生的回流和重绘

原文:https://www.cnblogs.com/coderwhytop/p/14876605.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!