所以我目前正在使用 wordpress 为电子竞技团队创建一个网站，我刚刚遇到了一个问题，我不记得如何解决。我记得在制作 chrome 扩展时有一种方法可以做到这一点，但我不记得了，这就是我现在在这里的原因:)
First code 正如您在图片上看到的，这就是 CSS 中的内容，我需要为其他页面保留它，但我希望我的一页覆盖它。我有一个允许我添加自定义 CSS 的框，但是当我添加代码时，它会被旧代码覆盖。我知道为什么会发生这种情况，但不知道如何在不更改原始 css 的情况下修复它（我宁愿避免）
所以我的问题是，如何让我的新 css 覆盖我的旧 css？ （我试过 !important 但它什么也没做）
【问题讨论】：
标签： html css wordpress web overwrite
在检查当前应用于特定元素的代码时，Chrome 还会告诉您应用该规则的特定选择器以及它的来源。您需要做的就是编写一个更强大的选择器，它将适用。在您的示例中，body:not(.template-slider) #Header { } 将被...覆盖
body.page:not(.template-slider) #Header {/* CSS here */ }
不过，理想情况下，最好不必增加当前选择器的特异性，而是最后应用您的规则，使用相同的选择器。最简单的方法是在活动主题的 style.css 末尾添加您的 CSS，除非您的主题/WP 安装搞砸了。
顺便说一下，如果您使用的主题不是您自己开发的，那么您的活动主题应该是子主题。这很重要，但您应该根据为什么重要、有什么好处以及如何做到这一点，单独研究它。
如果写信给您的活动主题的style.css（到目前为止，推荐的 WordPress 方式）不是一个选项，您可以随时将所有 CSS 放入您选择的单独样式表中（即my-custom-style.css)，放置在您的活动主题文件夹中，并在活动主题的functions.php 中使用以下代码注册它：
function add_styles_to_your_active_theme() {
wp_enqueue_style (
'my-custom-style',
get_stylesheet_directory_uri() . '/my-custom-style.css',
array(),
null
);
}
add_action( 'wp_enqueue_scripts', 'add_styles_to_your_active_theme' );
添加它并确保它加载后，您可以通过将其他已注册的样式表指定为您的依赖项来修改其在<head> 标记中的位置，使用上面对wp_enqueue_style() 的调用中的第三个参数。
您需要将其他已注册脚本的 句柄 放入该数组中。您可以通过查看任何页面的<head> 标记、找到最后加载的<link rel="stylesheet" /> 标记并从其id 中删除结尾-css 来找到句柄。例如，如果您最后加载的样式表的链接 id 是some-theme-style-css，那么您对wp_enqueue_style() 的调用的第三个参数应该是array('some-theme-style')。
之后，再次检查<head> 标签并确保您的标签位于最后。如果没有，请将每个<link /> 的id 添加到$deps 数组中，剥离-css，直到最后一个。当您的样式表最后加载时，您可以将任何应用选择器复制粘贴到它，将规则更改为您想要的任何内容，它们就会应用。
但请注意，在正常使用情况下，上述方法是不必要的。通常您应该使用子主题，将您的 CSS 放在其 style.css 中，而不必担心此类为主题和插件创建者保留的棘手细节。
【讨论】：
Yo can overwrite CSS with adding child selectors for your specified DIV element.
这里是小提琴示例http://jsfiddle.net/JfGVE/2031/
【讨论】：
code 来“欺骗”在答案中包含代码的规则。这条规则的存在是有原因的。不了解/不尊重社区规则总是会吸引反对票。我希望这会有所帮助。