博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
CSS“隐藏”元素的几种方法的对比
阅读量:6898 次
发布时间:2019-06-27

本文共 396 字,大约阅读时间需要 1 分钟。

1:display:none

 将元素设置为display:none后,元素在页面上将彻底消失,元素本来占有的空间就会被其他元素占有,也就是说它会导致浏览器的重排和重绘。
2:visibility:hidden
  设置元素的visibility为hidden也是一种常用的隐藏元素的方法,和display:none的区别在于,元素在页面消失后,其占据的空间依旧会保留着,所以它只会导致浏览器重绘而不会重排。

3:opacity:0

  这种方法和visibility:hidden的一个共同点是元素隐藏后依旧占据着空间,但我们都知道,设置透明度为0后,元素只是隐身了,它依旧存在页面中。

总结:visibility 和opacity会占据空间,会留下空白,display的空间会被占用

转载于:https://www.cnblogs.com/wdx330616/p/7428712.html

你可能感兴趣的文章
51. 源代码解读-RocketMQ消息重新消费
查看>>
在字符串中找出连续最长的数字串
查看>>
51CTO《OpenStack极速入门》视频课程上线了!
查看>>
LLDB调试增强工具Chisel的安装
查看>>
我的友情链接
查看>>
摄取的同时要懂得回报
查看>>
初识linux之httpd2.4.9 https
查看>>
Android 性能优化
查看>>
solr schema.xml配置详解
查看>>
yyModel字典(字典嵌套数组)转模型我遇到的坑
查看>>
密码嗅探工具dsniff
查看>>
一、数据库设计与性能优化--概述
查看>>
XamarinEssentials教程获取首选项的值
查看>>
Html的基础知识,基础标签的应用
查看>>
我的友情链接
查看>>
php获取客户端ip地址
查看>>
阴影覆盖scroll overflow
查看>>
php安装错误error: xml2-config not found. Please check your libxml2 installation
查看>>
Javascript中的checked
查看>>
我的友情链接
查看>>