overflow:隐藏；和z-index不能将元素隐藏在它下面？
overflow:隐藏；是CSS属性，用于控制元素内容溢出时的处理方式。当元素内容超出其指定的尺寸时，可以通过设置overflow属性来决定是否显示滚动条或隐藏溢出内容。
z-index是CSS属性，用于控制元素在垂直层叠顺序中的显示优先级。具有较高z-index值的元素会覆盖具有较低z-index值的元素。
根据问题描述，overflow:隐藏；和z-index不能将元素隐藏在它下面的原因是：
- overflow:隐藏；属性只能控制元素内容的溢出处理，而无法直接影响元素的显示与隐藏。它可以通过隐藏溢出内容来实现一定程度的隐藏效果，但并不能完全隐藏元素本身。
- z-index属性用于控制元素的垂直层叠顺序，具有较高z-index值的元素会覆盖具有较低z-index值的元素。然而，z-index属性并不能直接控制元素的显示与隐藏，它只能影响元素在层叠上下文中的显示顺序。
如果需要完全隐藏一个元素，可以使用display:none；或visibility:hidden；这两个属性可以将元素从文档流中移除或隐藏，达到完全隐藏的效果。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云CSS：https://cloud.tencent.com/product/css
- 腾讯云CDN：https://cloud.tencent.com/product/cdn
- 腾讯云云服务器CVM：https://cloud.tencent.com/product/cvm
- 腾讯云云数据库MySQL版：https://cloud.tencent.com/product/cdb_mysql
- 腾讯云云原生容器服务TKE：https://cloud.tencent.com/product/tke
- 腾讯云人工智能AI：https://cloud.tencent.com/product/ai
- 腾讯云物联网IoT Hub：https://cloud.tencent.com/product/iothub
- 腾讯云移动开发移动推送：https://cloud.tencent.com/product/umeng
- 腾讯云对象存储COS：https://cloud.tencent.com/product/cos
- 腾讯云区块链服务：https://cloud.tencent.com/product/baas
- 腾讯云虚拟专用网络VPC：https://cloud.tencent.com/product/vpc
相关·内容
但是，当一切都对齐时，您可以看到菜单项和价格下面的虚线。我试着使用标题中张贴的方法，但什么都没有？ }
background-color: #56ff47; position: relative; transform: translateY(81.5px); position: relative; z-indexf
浏览 22提问于2019-05-18得票数 0
回答已采纳
1回答
当视区小于960px时，我希望将绝对定位的div隐藏在视区之外。下面是带有隐藏规则的div和media查询的css： .newsbox{ position:fixed; top:0; background:#fff; width:395px;
浏览 2提问于2012-09-23得票数 0
回答已采纳
2回答
是否有一种不隐藏滚动条而以overflow: hidden;的方式隐藏内容的方法？我试图制作一个有视频背景的网站，为了使视频仍然适合不同大小的屏幕或不同高宽比的屏幕，我需要在某些时候将视频隐藏在屏幕之外。我一直这样做： position: absolute; left: 0; height: 100%;
z-index
浏览 0提问于2014-06-24得票数 0
回答已采纳
我有一个奇怪的问题，一个元素的z索引没有被设置，即使我放置了一个位置:绝对的。父元素具有溢出:隐藏集。
有人能帮忙吗？
浏览 2提问于2013-03-09得票数 3
回答已采纳
2回答
页眉和页脚标志
、、
b3924a; max-width:100%; max-height:100%; overflowd7cc75; height:9%; top:0px; z-index:1; position:relative; heig
浏览 6提问于2014-03-03得票数 0
回答已采纳
正如标题所示，我正在尝试将一个元素定位在z-index大于其父元素的元素之上。例如，我有以下HTML：<div class="line"></div>和CSS: 9;
浏览 2提问于2014-03-13得票数 1
标记是这样的：</iframe>
如你所见，iframe的高度是固定的，为350。在someurl.php中，我有一个滑块作为第一个垂直向上移动的元素</em
浏览 0提问于2011-10-28得票数 1
回答已采纳
我有一个网站，其中的主要标题有一个z-index:9999，然后完全独立的，我有一个滑块，它有z-index:1。滑块完全独立于页眉和主要内容页面。然而，由于某些原因，当我在IE7中使用下拉菜单时，子菜单隐藏在滑块后面。虽然这与子菜单无关，但它是整个标题(它只是子菜单中用户看到它被隐藏的地方)position:absolute;height:300px;margin-rig
浏览 1提问于2012-11-08得票数 0
如果你看看我正在设计的这个网站()，就会发现div元素的z索引有一个问题。点击左下角的stork & baby图像。在展开的图像中有一个关闭按钮，它隐藏在滑动按钮的下面。我的main.css的代码是： #Points {d
浏览 2提问于2013-12-08得票数 1
1回答
我有一个视频元素，我想用border-radius: 50%;隐藏在一个div里面，这在Chrome和火狐上工作得很好，但在Safari上不行。我的css的要点是： overflow: hidden; z-index: 1;
border-radius: 50%
浏览 2提问于2014-04-08得票数 6
主要问题是我无法更改ng-sidebar的CSS (默认情况下z-index为99999999 )，因此datepicker的弹出窗口隐藏在侧边栏的后面(日期选择器容器的z-index为1000)。当我检查元素时，我可以在'ng-sidebar‘中看到一个'aside’元素。'aside‘元素具有以下CSS： .ng-sidebar[_ngcontent-c17] {
-webkit-overflow-scrolling: touc
浏览 27提问于2018-12-21得票数 0
我在我的网站上有一个评论部分，可以选择使用Twitter引导下拉按钮进行编辑，但是我可以在下面看到，它隐藏在下面的评论中。下面是一个jsFiddl
浏览 1提问于2015-05-12得票数 2
回答已采纳
我有一个侧边栏导航菜单与子和子子，出现在悬停。下面是一个jsfiddle链接：
这显然是大大简化了，只是为了给出一个想法，我想要完成的。我的问题是，有时<nav>中的列表超过了<nav>的高度。在这种情况下，我希望能够在<nav>中滚动，但是这样做会损害我需要显示.sub-nav的overflow-x:visible属性，因为CSS根本不允许同时使用overflow-x:visible和overflow-y
浏览 1提问于2016-04-26得票数 1
1回答
试着在表格的任一方向滚动：<div style="position: relative; overflow: hidden;"&g
浏览 3提问于2016-12-11得票数 0
1回答
当你的鼠标悬停在附件上时，隐藏在滑块广告后面的子导航隐藏在IE下面，我已经设置了滑块层z-index:99；子导航z-index:9999；但它不起作用。
但是在FF和chrome下还可以。如何在IE下纠正它。谢谢
浏览 2提问于2012-03-03得票数 0
回答已采纳
1回答
我在safari上遇到了一些问题，并在导航元素上显示弹出窗口。由于某些原因，给定的z索引被忽略，弹出窗口隐藏在导航后面。下面是相关的HTML代码： <section class="application"><nav class="这里的代码更少 .application { left: 0;
浏览 23提问于2019-03-13得票数 0
1回答
为什么在本例中，如果将溢出设置为隐藏在父元素上，HTML5会使在子元素的高度计算上有所不同？如果没有HTML5文档类型和/或溢出，则显示文本时不隐藏文本。CSS position: relative;}
position: absolute;
top
浏览 0提问于2016-02-17得票数 0
回答已采纳
我正在尝试使用文本作为网站的背景图片-如果文本自动重排也没问题，但我尝试不滚动页面-所以在我的身体上我有overflow: hidden，它工作得很好，除非我的content div太长了，这时它也被隐藏了有没有办法让“背景”层溢出:隐藏，同时让我的内容在必要时流动？(我尝试过明显的溢出:隐藏在#background上)<div id="content"></div>
&
浏览 2提问于2011-08-13得票数 3
回答已采纳
我有一个问题，以实现溢出隐藏在引导导航栏。如果页面宽度较小，我希望隐藏导航栏元素。我让它在chrome上工作，使用：但它在firefox和IE上不起作用。元素被包装在两行或更多行中。下面是示例：
我也尝试过：overflow-x: hidden;，但它在火狐/IE上也不起作用。
浏览 2提问于2013-04-12得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
