当前,我使用CSS特定性来覆盖插件样式。我更喜欢用它来编辑插件,因为这样可以减少您更新时的麻烦。这会使我的样式表更漂亮。

评论

赞成教我有关CSS特异性的知识,在您提出问题之前从未听说过它,它对我有很大帮助!

#1 楼

如您所建议,最优雅的方法是在插件插入CSS之后加载CSS覆盖。这是很容易实现的-您只需要确保header.php在引用样式表之前调用wp_head()即可:

<head>
    <!-- all the usual preamble stuff goes here -->

    <?php wp_head(); ?>

    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" />
</head>


评论


如果我使用儿童主题怎么办?我不喜欢覆盖父主题的header.php。

–法律
2012年11月7日上午10:10

#2 楼

插件可以通过多种方式来处理CSS。


最好的情况:插件使CSS排队并提供禁用它的选项(禁用它,将CSS代码复制到样式表中并感到高兴);
很好的情况:插件会钩住样式队列功能(解钩函数,如果需要,可以用mods钩住自己的钩子);
通常的情况:插件直接将CSS排入队列。请参阅如何使脚本出队? (也适用于样式)。简短版本-将来的WP版本中将提供出队功能,现在可以解决问题。逐个案例...

总的来说,禁用单独的样式表并将其合并到您自己中以更好地减少问题和提高性能(减少要提取的文件)会更好,更容易。

评论


我怎么知道是哪一个?

–伊恩·爱丁顿
2015年11月18日,0:30

通过主要查看代码。 :)

–稀有
15年11月18日在8:36

#3 楼

另一个非常优雅的方法是使用CSS的特异性。

因此,如果插件的CSS表示:

div.product div.images img {
  ......
}


您可以在CSS中定义:

body div.product div.images img {
  ......
}


有关类似问题,请参见迈克尔·拉德(Michael Rader)的答案。

评论


好的,非常感谢。这将是我接受的答案。只需使用一般的style.css,特异性就可以发挥出它的光泽!

–路卡·雷格尔林(Luca Reghellin)
15年5月18日在9:44

#4 楼

我将“不愿意的”插件CSS的副本保存到主题文件夹,并通过向其中添加

@import url('name-of-the-plugin-css.css');


将其导入到主题CSS中(当然,我要插入的.css的名称)。然后,我修改主题文件夹中的css副本,然后像处理其他文件一样将其保存到服务器。哦,是的,有时可能需要通过指定“!important”来“钉住”更改的ID或类。没有伤害,效果很好。

#5 楼

要覆盖已经使用特殊性和!important的插件的CSS,我使用ID覆盖了这些类。这确实清理了我的代码。当然,它也不是一个完美的解决方案,因为它仅在将id分配给元素和类时才起作用。

从理论上讲,您也可以使用属性选择器。但是,我尚未对该理论进行检验。

#6 楼

我最终将!important用于我的自定义CSS,并且覆盖了我遇到麻烦的插件的样式。插件的开发人员在整个插件css中都使用!important,这就是为什么没有!important时我无法覆盖它的原因。
body {
font-family: "Open Sans", Arial, sans-serif !important;
font-weight: 300 !important;    
}


#7 楼

要覆盖已经使用特殊性和!important的插件的CSS,我使用ID覆盖了这些类。这确实清理了我的代码。当然,它也不是一个完美的解决方案,因为它只有在为元素和类分配了ID的情况下才起作用。但是,我尚未对该理论进行检验。