Question

我不知道它是如何发生的，对于我的生活，我无法解决它。

我有一个使用display：none;

隐藏的div

当用户点击时，我设置display：block，显示一个新图层。

问题在于所有文本都是从它后面的图层中显示出来的......我如何强制后面的div没有透明度？

我的css中没有设置透明度或不透明度。

我显示的图层只有以下设置：

.display { 
    background: rgb(255, 255, 255) url(/template/mobile/images/dot.gif) repeat left top;
    display:none; 
    width: 250px; 
    height:100px; 
    border: 1px solid rgb(20, 20, 20);
    margin-left: -5px;
    margin-top: -100px;
    float: left;
    z-index: 999;

}

如你所见：我尝试使用1px背景图像 - 仍然是透明的我将背景颜色设置为白色 - 仍然是透明的我已经尝试设置z-index，因此它在所有内容之上 - 仍然是透明的

我不知道它为什么以及如何阻止它？

注意：我已停用了实际网站，可以在以下网址进行测试时查看此代码：http://dev.cutmyhair.com.au/search_results.php?keyword=waverley 注意：此问题仅发生在网站的.mobi版本上（因此您需要在手机上或使用mobi模拟器查看）

Answer 1

我能够使用FF3和IE8重现这一点。

您需要将头寸设置为绝对或相对。

.display { 
    position: absolute;
    ...
}

或

.display {
    position: relative;
    ...
}

Answer 2

您确定这是透明度问题吗？我看到另一个问题：

高度：100像素 margin-top：-100px

如果float属性受到周围其他元素的影响，那么这两个将使你的div完全不在页面之外。也许在这里发布html部分和其他相关的css规则，这样我就能更好地了解情况。无论如何，首先，通过使用像Firebug或Chrome开发控制台这样的好的html / css调试工具，确保你的div位于你认为的位置。

Answer 3

尝试使用display：inline-block（而不是block）。它似乎对浮动元素更好（更直观）。

如何删除css背景透明？

3 个答案: