AI智能
改变未来

【css3 】opacity和rgba()、display、visibility–显示隐藏的区别


显示与隐藏

opacity:0;隐藏与visibility:hidden;的效果一致,还有rgaba()
只是单纯地设置了dom元素的css样式,好比给一个人化妆
display:none;却是真实地操作dom元素,显示与隐藏即dom元素有没有渲染出来。好比这个人存不存在一样
由此可见其他三种比display:none;的效果要好,我们都知道操作dom元素会大大消耗性能,并且display:none;在切换显示隐藏的时候回激起页面回流
回流:页面的一部分因为元素的尺寸、显示与隐藏、布局状态发生改变
即页面重新加载
重绘:当页面的css样式发生变化

PS:rgba(0,0,0,.5)表示黑色,50%透明度alpha的a(0-1)越靠近0越趋于透明,1是颜色最深的
赞(0) 打赏
未经允许不得转载:爱站程序员基地 » 【css3 】opacity和rgba()、display、visibility–显示隐藏的区别