CSS：透明div部分的不透明叠加层 [英] CSS: Opaque overlay with transparent div sections

问题描述

我正在开发一个网站的帮助系统，他们希望网页变得不透明，除非你可以接受帮助的DIV。

问题是我无法弄清楚如何获得特定的div在不透明的背景上显示透明。

我试图将div的z-index设置为一个比背景高的值，但似乎不工作。

这里是一个JSBin说明这个问题。任何与帮助类应该是透明的（即不透明）

http://jsbin.com/ifohuc/1/edit

感谢。

您必须在css文件中设置li.help的position属性

  position：relative; 
  

I'm developing a help system for a site where they want the page to turn opaque when activated except for the DIVs you can receive help on.

The problem is I can't figure out how to get specific divs to "appear" transparent on top of an opaque background.

I tried setting the z-index of the divs to a value higher than the background but that doesnt seem to work.

Here is a JSBin illustrating the issue. Anything with the "help" class should appear to be transparent (i.e. not opaque)

http://jsbin.com/ifohuc/1/edit

Thanks.

解决方案

You must set the position attribute of li.help in the css file

for example

position:relative;

这篇关于CSS：透明div部分的不透明叠加层的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！