文本框的背景颜色不会改变答案

【问题标题】：background color for text box won't change文本框的背景颜色不会改变
【发布时间】：2018-08-15 02:37:25
【问题描述】：

我有以下代码，我想在图像上放置一个文本框。文字覆盖了图像，但是当我将背景颜色设置为白色时，它仍然显得透明。我以前做过这个，但由于某种原因它在这里不起作用。任何帮助将不胜感激。

    <section>
        <h1 style="margin-left: 10%;">Blah, blah</h1>
        <img src="_images/some.jpg" style="margin-left: 10%; width: 60%;" >
        <section style="margin-left: 45%; margin-top: -35%; background-color: #FFF; padding: 1em; width: 20%;">
            <p style="font-size: 2em; margin-top: -5%;">More blah, blah.</p>
            <p style="font-size: 1.2em; ">Even more blah, blah.</p>
        </section>
    </section>

【问题讨论】：

标签： html css background-color

【解决方案1】：

将内部部分元素的位置设置为相对。

<section>
        <h1 style="margin-left: 10%;">Blah, blah</h1>
        <img src="https://images.pexels.com/photos/34950/pexels-photo.jpg?auto=compress&cs=tinysrgb&h=350" style="margin-left: 10%; width: 60%;" >
        <section style="position: relative; margin-left: 45%; margin-top: -35%; background-color: #FFF; padding: 1em; width: 20%;">
            <p style="font-size: 2em; margin-top: -5%;">More blah, blah.</p>
            <p style="font-size: 1.2em; ">Even more blah, blah.</p>
        </section>
    </section>

【讨论】：

【解决方案2】：

而不是

background-color: #FFF;

使用这个

background-color: rgba(0,0,0,0);

【讨论】：

为什么会有任何改变？它只是依靠背景可能是白色的事实。如果它改变了，0 的不透明度将使它不再是白色的......