【问题标题】:CSS Styling (Text, and paragraph backgrounds)CSS 样式(文本和段落背景)
【发布时间】:2026-02-10 21:50:01
【问题描述】:

我希望创建一个网站,以白色背景显示我的信息段落,并且我希望段落背景为黑色,但不透明度较低,以便清楚地区分其他颜色和 100我正在显示的文本的 % 不透明度。但是,我似乎无法弄清楚如何做到这一点。

到目前为止,我已经尝试将整个文档的背景更改为浅蓝色,将文本更改为白色并将段落背景更改为黑色并降低不透明度。背景颜色和文本一样发生了变化,但是段落背景根本没有出现。即使在我删除了不透明度值以确保我不只是将不透明度设置得太低之后。我想知道是否有人知道我该如何解决这个问题。非常感谢您为我提供的所有帮助。

body{ 背景:#00FFFF;字体系列:宋体; } p{ 背景:#000000; } div { 颜色:白色; }

Div 包裹在段落内的文本周围

【问题讨论】:

    标签: html css styling


    【解决方案1】:

    如果我理解正确,您希望某些段落的背景稍暗。您可以使用 rgba 函数将不透明度包含在背景中:

    body{ background:#00FFFF;  font-family:arial; } 
    p{ background:rgba(0,0,0,0.2); color:white} 
    <p>
        my text
    </p>   

    【讨论】:

    • 太棒了!非常感谢您的帮助!
    • @Kurrel 欢迎您!祝你的网站好运:)
    【解决方案2】:

    您不能在&lt;p&gt; 中使用&lt;div&gt;,因为这是无效的 - 两者都是块级元素。您可以使用 &lt;span&gt; 代替,它是一个内联元素。
    欲了解更多信息,您可以查看http://www.w3.org/TR/html401/struct/text.html#edef-P

    举例说明:

    body {
        background:#00FFFF;
        font-family:arial;
    }
    p {
        background:#000000;
    }
    div, span {
        color:white;
    }
    <div>
        <p>This is a paragraph inside a div.</p>
    </div>
    <p>
        <div>This is a div inside a paragraph which is not valid.</div>
    </p>
    <p> <span>This is a span inside a paragraph which is fine.</span>
    
    </p>

    【讨论】:

      【解决方案3】:

      这是一个演示http://jsfiddle.net/uh632aL4/

      勾选是使用background-color:rgba(0,0,0,0.4); 作为 div 元素。 这样,您的文本将具有 100% 的不透明度,您可以根据需要更改 div 元素的不透明度。

      【讨论】: