【发布时间】:2014-01-27 13:36:22
【问题描述】:
我创建了一个具有以下样式的叠加层:
#overlay-2 {
height: 100%;
width: 100%;
position: fixed;
left: 0;
top: 0;
background: none repeat scroll 0 0 #000000;
opacity: 0.85;
z-index: 10;
}`
我正在尝试让我的标题仍显示在叠加层之上。 (当下拉菜单打开时,我使用叠加层,网站会变暗(带有叠加层),但标题和菜单仍然正常)。
这只是我的标题 ID 之一:
#header_main {
z-index: 11;
position: relative;
}
还有一个:
#megaMenu {
position: relative;
z-index: 500;
}
但没有任何改变!我什至像覆盖一样将位置更改为固定,但仍然没有变化。这可能是什么原因造成的? 此外,我听说过关于 z-index 在不同职位类型之间是否仍然相关的混合信息。前任。固定与相对没有任何意义。它们的 z 索引彼此无关。而其他人则恰恰相反“只要不是静态的,什么职位类型都没有关系”
------------已更新:--------- -------------- 这是 html(来自 firebug)wordpress 网站。
<head>
<body id="top" class="home page page-id-1412 page-template-default logged-in stretched open_sans open_sans siteorigin-panels" itemtype="http://schema.org/WebPage" itemscope="itemscope">
<div id="wrap_all">
<header id="header" class="header_color light_bg_color mobile_drop_down" itemtype="http://schema.org/WPHeader" itemscope="itemscope" role="banner">
<div id="header_meta" class="container_wrap container_wrap_meta">
<div id="header_main" class="container_wrap container_wrap_logo">
<div id="header_main_alternate" class="container_wrap">
<div class="header_bg"></div>
</header>
<div id="main">
</div>
<div class="main_color avia-builder-el-9 el_after_av_slideshow_full masonry-not-first container_wrap fullsize">
<div id="after_masonry" class="main_color container_wrap fullsize">
<div id="av_section_3" class="avia-section main_color avia-section-default avia-no-shadow avia-builder-el-11 el_after_av_one_full container_wrap fullsize">
<div id="after_section_3" class="main_color container_wrap fullsize">
<div id="footer" class="container_wrap footer_color">
<footer id="socket" class="container_wrap socket_color" itemtype="http://schema.org/WPFooter" itemscope="itemscope" role="contentinfo">
<div id="login-box" class="login-popup">
//scripts etc..
<div id="fb-root"></div>
<div id="overlay-2" style="display: block;"></div>
</body>
【问题讨论】:
-
请包含您的标记
-
也添加你的html代码
-
它似乎在这里工作:jsfiddle.net/7e6eM
标签: css