0

我有一个具有以下 css 元素的 css 文件:

.ms-webpart-chrome {
    background-color: white;
}

我想让它透明而不是白色,同时我想让这个 css 元素就像它一样,因为它是一个全局 css 并且一些页面正在使用它。

所以我在想我可以使用继承它。

这就是它在 html 中的外观,并且这个 div 类是自动生成的,这意味着我无法更改或做任何事情。

<div class="ms-searchCenter-main">
            <div class="ms-webpart-zone ms-fullWidth">
        <div id="MSOZoneCell_WebPartWPQ1" class="s4-wpcell-plain ms-webpartzone-cell ms-webpart-cell-vertical ms-fullWidth ">
            <div class="ms-webpart-chrome ms-webpart-chrome-vertical ms-webpart-chrome-fullWidth ">

所以基本上我需要像它一样拥有这个,因为我不想更改或删除它:

.ms-webpart-chrome {
    background-color: white;
}

我需要创建一个新的并将 !important 与继承一起使用。

任何形式的帮助表示赞赏

注意:我尝试了以下操作:

.ms-searchCenter-main .ms-webpart-chrome
{
background-color: transparent !important;
}

但它没有用

4

2 回答 2

2

您当然可以将背景颜色指定为“透明”,因为这是 CSS 规范中的默认值(请参阅w3schools.com 上的参考页面)。

如果您的目标是使背景颜色在所有具有“ms-webpart-chrome”类的元素中透明,请尝试添加更多选择器以增加新规则的权重:

body div.ms-webpart-chrome {
    background-color: transparent !important;
}

设置“背景:无;” 也是一种选择。您可以尝试同时添加两者。

如果您的新规则遵循另一条规则会更好(不是直接,而是按顺序紧随其后)。此外,检查是否有任何子元素正在拾取背景。

虽然 IE 有开发者工具,但我强烈推荐 Firefox + Firebug + DOM Inspector + Web Developer Toolbar 作为标准测试套件。您可以轻松地遍历 DOM 以查看是否有任何子元素应用了背景,以及在页面上实时测试不同的 CSS 规则。

于 2013-06-20T06:15:34.720 回答
0

您不能将背景颜色指定为透明,因为透明不是颜色。但是,您可以使用background: none !important;. 默认情况下,元素没有背景颜色,因此只需将其恢复为默认值(无),它将是透明的。

在此处查看此演示。我已经在顶部将背景设置为红色,但随后用background: none;下部覆盖它。这使它变得透明。红色边框显示元素所在的位置

于 2013-02-25T17:09:57.920 回答