Question

我有一个讲话泡泡形状的div。这是代码：

<div class="dragThis" id="dragThis">
        <div class="content" id="content">
            <p>
                <asp:Label ID="lblContent" runat="server" Text="Label"></asp:Label>
            </p>
        </div>
        <div class="pointer">
            <div class="one">
            </div>
            <div class="two">
            </div>
        </div>
    </div>

这是css：

<style type="text/css">



        .dragThis
        {
            width: 400px;
            color: #efefef;
            position: absolute;
        }
        .pointer
        {
            -moz-opacity: 0.5;
            -khtml-opacity: 0.5;
            filter: alpha(opacity=50);
            height: 560px;
        }
        .dragThis .pointer
        {
            height: 35px;
            background: #393939;
        }
        .dragThis .pointer div
        {
            height: 100%;
            background: #ffffff;
        }
        .dragThis .pointer .one
        {
            width: 50%;
            -moz-border-radius-topright: 35px;
            -webkit-border-top-right-radius: 35px;
            float: left;
        }
        .dragThis .pointer .two
        {
            width: 50%;
            float: right;
            -moz-border-radius-topleft: 35px;
            -webkit-border-top-left-radius: 35px;
        }
        .dragThis .content
        {
            padding: 10px;
            -moz-border-radius: 10px;
            -webkit-border-radius: 10px;
            background: #393939;
            text-align: center;
        }
    </style>

这里的问题如你所见，讲话泡泡的下半部分是％50可见。我希望黑色部分是％100可见，而其他所有部分都是透明的。

谢谢。

Answer 1

一个工作的例子会很好。

您无法将不透明度分成不同的部分。但是如果你的元素没有背景，除边框外，它将是透明的。

Answer 2

除了不透明度，您可以使用rgba颜色，最后一个值为0，例如rgba（255,255,255,0）。就我而言，不透明度是继承的，但rgba值不是。

使div透明但保持边框可见

2 个答案: