CSS 无法在子元素中将背景图像设置为 none

Question

我已将父元素中的背景图像属性设置为：

Full screenshot

它工作正常。

在父元素中，id 设置为 "content" 我有一个子元素 ID "comments".

Full screenshot

无论我尝试过什么，它都没有任何效果。我试图将其设置为 none 甚至更改为另一张图片。没有任何帮助。我想删除子元素的背景图像或更改它。

请大家帮忙，我找不到这次我在哪里做了一件愚蠢的事情(

Answer 1

如果我没理解错的话，如果你想让子元素没有背景可以加

#comment{
background: rgba(255, 255, 255, 0);
}

并尝试删除此元素可能覆盖的任何其他背景属性

如果您需要为子元素使用不同的背景，请添加以下内容

#comment{
background:url(../path/to/image);
background-position:center;
background-size:cover
}

如果你想保持图像的宽高比，那么将 cover 更改为 contain 但这可能不会填满整个 #comments div 为了尊重比例

如果您需要添加图案背景，请使用 background-repeat:repeat 并删除 cover 和 center

Answer 2

我认为用 HTML 的当前结构不可能做你想做的事。 #comments div 是 #content div 的子元素，它有一个背景集。即使你给 #comments 没有背景，它仍然会显示父元素的背景。也许您可以将 #comments 的背景设为白色以覆盖在 #content div 之上？或者从父元素中删除 #comments。

示例CSS：

#comments {
  background: #FFFFFF;
}

Answer 3

要么将 comments 框移出 content 元素，这样 content's background 就不会覆盖 comments，或者给评论元素自己的 background（颜色或图像）。

从您的屏幕截图看来一切正常。从技术上讲，所有 DOM 元素默认都是透明的，它没有背景，是透明的。所以你的评论是透明的，没有背景。因此，通过将它设置为 none 你不会改变任何东西，因为它的 background 是 none.

CSS 无法在子元素中将背景图像设置为 none

CSS can't set background-image to none in child element

css

background-image