隐藏元素的方法

最新推荐文章于 2023-05-05 09:52:38 发布
最新推荐文章于 2023-05-05 09:52:38 发布
阅读量682 收藏 3
点赞数 2
分类专栏： css 文章标签： opacity visibility display 隐藏元素的方法 opacity visiblity display隐藏元素的区别
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_37686205/article/details/90897531
版权

隐藏一个元素可通过css属性设置，有三种不同的方法，每一种方法之间有不同的区别，如下：

  • opacity:0：隐藏元素，但是不会改变布局，即元素还是会占位置；相应的在该元素上绑定的事件还是会触发
  • visibility:hidden：隐藏元素，但是不会改变布局，即元素还是会占位置；相应的绑定的事件不会触发
  • display:none：隐藏元素，但改变了布局，元素不占位置，相当于删除了元素
阳光下的冷静
关注
  • 2
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
css中实现元素隐藏的几种方法
simple_Xsg的博客
04-09 2万+
一、display:none; display翻译成中文是显示、展览的意思；将display的属性改为none可以实现元素的隐藏，元素和盒子模型也不生成，被隐藏的元素不占位置，看不见摸不着，它会导致浏览器的重排和重绘。 二、visibility:hidden; visibility翻译成中文是能见、可见性的意思；hidden翻译成中文的是隐藏、不易察觉的意思。将visibility的属性改成hidden可以实现元素的隐藏，和display:none的区别是它占位置，看不见但是摸得着，所以它只会导致浏览
隐藏元素的几种方法
Wennsai的博客
10-06 1万+
隐藏元素的几种方法 1、overflow:hidden; 防止溢出，也是一种隐藏，只不过是把超出范围的元素隐藏，这种一般用于文字过多或者图片特效以及自适应中div没法设置高度时使用 2.display:none 设置元素的display为none是最常用的隐藏元素的方法。 .hide { display:none; } 这就是完全的隐藏了，直接消失，任何对该元素直接的用户交互操作都不可能生效，被隐藏的元素完全不会占用空间，仿佛元素完全不存在一样。 3、opacity:0 opacity属性表示
将页面元素隐藏的10种方法
jimojianghu的专栏
05-05 4027
在Web开发中，隐藏页面元素使其视觉不可见是一个非常常见的需求。为了实现这一目标，我们通常会采用多种方法，最常用的例如CSS的display属性，只要设置为node即可隐藏元素。本文将通过对当前所有可用的隐藏元素的方法做了一个总结，大概有10种方法可以使用。
清除浮动
02-01 121
第一种方式： //IE浏览器 .clearfloat{ zoom:1} //其他浏览器.clearfloat ; after{ display:bloak; clear:both; content:""; visibility: hidden; height:0} 第二种方式：更优雅的 //IE浏览器 .clearfloat{ zoom:1} //其他浏览器....
前端面试题：隐藏元素的方法有哪些？(全)
薇z的博客
06-28 2928
面试题：隐藏元素的方法有哪些？(全)
jQuery使用hide方法隐藏元素自身用法实例
10-24
主要介绍了jQuery使用hide方法隐藏元素自身用法,实例分析了jQuery中hide方法的原理与使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下
js判断元素是否隐藏的方法
10-25
主要介绍了js判断元素是否隐藏的方法,需要的朋友可以参考下
js获取隐藏元素宽高的实现方法
10-22
下面小编就为大家带来一篇js获取隐藏元素宽高的实现方法。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
JQuery显示隐藏页面元素的方法总结
10-24
主要介绍了JQuery显示隐藏页面元素的方法总结,本文分别讲解了show()、hide()、toggle()、slideDown()、css()5种控制显示隐藏某个DIV或P标签等页面元素的方法,需要的朋友可以参考下
jquery(hide方法)隐藏指定元素实例
10-26
jquery(hide方法)隐藏指定元素实例 jquery是一个功能强大且广泛使用的JavaScript库，它提供了许多实用的方法来操作网页元素。在这篇文章中，我们将探讨jquery的hide方法，该方法用于隐藏指定的网页元素。 首先，让...
CSS中容易忽略的知识点集锦
weixin_48390287的博客
03-08 318
CSS中的一些冷知识 长度单位 在CSS样式层叠表中，我们可使用到的长度单位一般有如下的几种方式： 像素：px 百分比 em: 这是一个相对单位，是相对于当前元素的字体大小进行计算，也就是说 1em=1font-size rem: 这也是一个相对单位，不同的是，rem是相对于根元素的字体大小进行计算的。 伪类和伪元素 伪类：用来描述一个元素的特殊状态 ：hover，：active等等 伪元素：用来描述一个元素的特殊匹配位置 如 ：：before，：：after等等 其实，伪类和伪元素的出现都是为了
元素隐藏的方式
m0_60502228的博客
08-23 199
1、overflow:hidden; 这是防止溢出，也是一种隐藏，只不过是把超出范围的元素隐藏，这种一般用于文字过多或者图片特效以及自适应中div没法设置高度时使用 2、display:none;这就是完全的隐藏了，直接消失，任何对该元素直接的用户交互操作都不可能生效，被隐藏的元素完全不会占用空间，仿佛元素完全不存在一样。 3、利用opacity透明度来隐藏，opacity设置为0，它只是一种视觉隐藏，元素本身依旧占用它的位置并对网页的布局起到作用，它也同样影响用户交互。在读屏软件中会被识别。 ...
隐藏元素的方法总结
forward_xx的博客
09-18 610
本文从完全隐藏、视觉上隐藏、语义上隐藏三个角度来对CSS隐藏元素方法进行了总结，并分析比较opacity: 0、visibility: hidden、display: none 的区别和优劣。
隐藏元素的三种方式
jxl03280825的博客
10-10 1535
方法1： display:none .hide{ display: none; } 设置元素的display属性为none；不占用页面空间，其占有的空间会被其他元素所占有，从而会引起浏览器的重排和重汇。 方法2： visibility:hidden .hide{ visibility: hidden; } 设置元素的visibility属性为visibility:hidden;元素会占用页面空间，因此只会导致浏览器的重...
隐藏元素的各种方法
M106588L的博客
09-20 385
CSS隐藏元素的几种方法 1、display，使用none值会让元素从文档中直接删除，”直接消失不见了” 用法：display:none 优点：简单暴力，不需要多余代码。不占空间，对布局没影响。 缺点：元素从文档删除，不利于seo 2、text-indent，一般是首行缩2个中文字的用法是text-indent:2em。但当给他一个足够大的负值，大到一般我们浏览器无法显示。 用法：text-ind...
窗口所在位置，元素的宽高
wybxzht的博客
09-07 234
Window视图： 浏览器相对于屏幕的位置 screeLeft screeTop screenX screeY 浏览器窗口大小 outerWidth outerHeight 页面视图的大小 innerWidth innerHeight Document文档视图 （低版本IE的innerWidth、innerHeight的代替方案） document.documentElement.clientWidth 浏览器窗口可视区宽度（不包括浏览器控制台、菜单栏、工具栏、滚动条） document.documentE
隐藏元素的八种方法
小红帽的博客
06-02 4324
visibility: hidden; 这个属性只是简单的隐藏某个元素，但是元素占用的空间任然存在opacity: 0; CSS3属性，设置0可以使一个元素完全透明position: absolute; 设置一个很大的 left 负值定位，使元素定位在可见区域之外display: none; 元素会变得不可见，并且不会再占用文档的空间。transform: scale(0); 将一个元素设置为缩放
CSS隐藏元素的五种方法
heye13的专栏
06-20 8832
CSS隐藏元素的方法
CSS隐藏元素五种方法
热门推荐
qq_40950549的博客
01-07 3万+
css隐藏元素的方法 1、利用opacity透明度来隐藏，opacity设置为0，它只是一种视觉隐藏，元素本身依旧占用它的位置并对网页的布局起到作用，它也同样影响用户交互。在读屏软件中会被识别。 2、visibility：规定元素 是否可见，一般设置为hidden，它可以很好的隐藏，不会影响用户的交互，在读屏软件中不会被识别。（visibility可能的值） visible
css隐藏元素方法有？
最新发布
05-25
常用的 CSS 隐藏元素方法有以下几种： 1. display:none：完全隐藏元素，元素不占据空间。 2. visibility:hidden：元素被隐藏，但仍占据空间。 3. opacity:0：将元素透明度设置为 0，元素不会被隐藏，但无法看到。...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值