html div 元素透明

Question

我有这个代码：

<li class="nav-item dropdown" id="noti_Container" >
 <div id="noti_Counter" style="opacity: 1; top: -2px;"></div>
 <a style=" margin-right: 20px; color: white;" >
 <i class="fa fa-bell-o fa-lg" id="noti_Button" aria-hidden="true" ></i></a>
 <div id="notifications" style="display: none;">
  <h3>Notifications</h3>
  <div  id="not1"> </div>
  <div class="seeAll"><a href="#">See All</a></div>
 </div>
</li>

通知在 javascript 代码中生成并添加到 div not1。我的问题是这个 div 透明并且背景中的元素出现了。我在 css 中寻找透明和不透明但没有找到。怎么改成正常的div外观？后台的 table 会干扰打开通知。应该注意的是，通知也由 table 元素组成。也许这就是问题的根源？

Answer 1

您的问题不在于透明度，它与 CSS 中的 z-index 属性有关。尝试更改前后两个元素的 z-index，看看会发生什么。

html div 元素透明

html div element transparent

html

css

transparent

opacity