我想在打开导航栏时在内容上显示一个半透明 mask 。
这是我的代码:
<nav class="navbar navbar-default">
<div class="collapse navbar-collapse"">
<ul class="nav navbar-nav">
<li><a href="/Home">Home</a></li>
<li class="dropdown">
<a href="/about" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">About</a>
<ul class="dropdown-menu">
<li><a href="/about/what">What</a></li>
<li><a href="/about/how">How</a></li>
</ul>
</li>
</ul>
</div>
</nav>
<div class= "content">
<div class = "container">
<div class = "row">
<div class="col-sm-10">
Enter Text Here
</div>
</div>
</div>
有没有办法只使用 css 来做到这一点?
最佳答案
如果将类添加到事件导航项,是否会出现类似兄弟选择器的东西?
nav.active + .content {
display: block;
width: 100%;
height: 100%;
content: " ";
position: absolute;
background: rgba(0,0,0,0.6);
left: 0;
top: 0;
z-index: 999;
关于html - 打开导航菜单时使内容不透明,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35018923/