Question

在我开始之前，是的，我知道这个问题已被多次询问，但无论如何我无法让它工作。我有一个div是透明的，但内容即文本和输入字段，我不想透明。

请不要链接到之前的答案，因为我跟着他们但没有成功。

以下是我的CSS代码：

.csmodal {
    height: 300px;
    width: 600px;
    background-color: rgba(25, 11, 36, .5);
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#7F00FF00', EndColorStr='#7F00FF00');
    float: none;
    display: inline-block;
    padding: 30px;
    margin: 200px auto;
    opacity: 0.4;
}

.cs-container {
    margin-right: auto;
    margin-left: auto;
}

#cs-headline {
    margin-bottom: 20px;
}

#cs-description {
    font-size: 14px;
    line-height: 20px;
    color: #eeee22;
}

h1 {
    margin: 10px 0;
    text-rendering: optimizelegibility;
    color: #eeee22;
}

HTML code：

<div class="cs-container">
    <div class="row">
        <div class="col-md-6 col-md-offset-3 csmodal">
            <h1 id="cs-headline">Website Launching Soon</h1>
            <div id="cs-description">
                <p style="text-align: center;">The launch of our official website is coming soon. Stay tuned!</p>
            </div>
            <form class="form-horizontal">
                <div class="form-group">
                    <div class="col-sm-10">
                        <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
                    </div>
                </div>
            </form>
        </div>
    </div> </div>

Answer 1

指定元素不透明度会更改父级和所有子级的不透明度。

在功能方面思考我们想要的是能够看到背景。在这种情况下，我们可以应用背景颜色或alpha通道，如下所示：background-color:rgba({0 -255},{0 -255},{0 -255},[0 - 1]最后一部分确定不透明度。

如果您想要拥有Alpha通道的图片，则需要拥有透明资源。 like so

如果您可以将元素放在绝对位置并对其应用不透明度等等，那么请运用您的想象力

透明div但不是里面的内容

1 个答案: