未使用的子主题CSS优先级问题！重要

时间：2015-02-11 作者：Dharkov

我将WordPress站点更改为使用子主题，但父主题样式优先于我对子主题CSS所做的任何更改。我可以使用!important, 然而，这是一个不完整的解决方案，子主题应该作为站点的第一个资源。

例如，在my site, 包括的边框.wp-caption 与使用!important 标签，但没有它就无法工作。

这与功能有关吗。php文件？

这是我的PHP文件的内容：

add_action( \'wp_enqueue_scripts\', \'theme_enqueue_styles\' );
function theme_enqueue_styles() {
    wp_enqueue_style( \'parent-style\', get_template_directory_uri() . \'/style.css\' );
}

4 个回复

最合适的回答,由SO网友:rambillo 整理而成

尝试将子主题的CSS排队，如下所示：

// Queue parent style followed by child/customized style
add_action( \'wp_enqueue_scripts\', \'theme_enqueue_styles\', PHP_INT_MAX);

function theme_enqueue_styles() {
    wp_enqueue_style( \'parent-style\', get_template_directory_uri() . \'/style.css\' );
    wp_enqueue_style( \'child-style\', get_stylesheet_directory_uri() . \'/styles/child-style.css\', array( \'parent-style\' ) );
}

请注意以下几点：

1）PHP\\u INT\\u MAX作为优先级，因此它最后运行一次

2）get\\u stylesheet\\u directory\\u uri（）与get\\u template\\u directory\\u uri（）将指向子主题的模板文件夹，而不是父主题

我也在那里添加了一个子文件夹/styles/ 因为我通常将CSS保存在主题的子文件夹中
后接array( \'parent-style\' ) 使子CSS将父CSS作为依赖项，这样做的效果是将父主题放在开头，子主题CSS放在后面。因此，无论在子主题中出现的内容已经在父主题中，都将覆盖父主题的版本。

SO网友:Henrik Erlandsson

TLDR答案：每个的第一个参数wp_enqueue_style() 不应保留为“父样式”和“子样式”。他们应该是renamed 匹配父主题及其子主题的名称。

Problem

如果不重命名参数，则会使子主题再次排队，这可能会导致规则在Firebug中出现两次，并且更改错误的值不会产生明显的效果，这可能会让您误以为子规则不会覆盖父规则。

The expectation

这个Codex page on Child Themes 正确地说，如果您什么都不做，子CSS将自动链接。是的，但仅此而已。CSS工作流有点不同：您希望覆盖，而不是替换。这是合乎逻辑的（它与其他主题文件一样工作），但他们本可以有一个注释。

Solution

重命名参数。我这样做是为了获得（一点）更多的控制，note 你应该用你的主题和子主题的名称来代替二零一六和二零一六子主题：

function theme_enqueue_scripts() {
    //FIRST
    wp_enqueue_style( \'twentysixteen-style\', get_template_directory_uri() . \'/style.css\' );

    //...custom queueing of .js and .css for Javascript plugins and such here

    //LAST
    wp_enqueue_style( \'twentysixteen-child-style\', get_stylesheet_directory_uri() . \'/style.css\', array( \'twentysixteen-style\' ) );
}
add_action( \'wp_enqueue_scripts\', \'theme_enqueue_scripts\' );

（还请注意，您无法控制某些（所有？）的链接顺序）此操作中的WP插件。之后会链接到。）

快乐的选择器搜索；）

SO网友:Twodogstar

您可以在子主题的CSS中使用更具体的选择器，以使其优先。

因此，不是：


.wp-caption {
     background: #2d2d2d !important;
}

使用：


.entry .wp-caption {
     background: #2d2d2d;
}

您还需要确保将子主题样式表排入函数中。php文件，如果您还没有。

http://codex.wordpress.org/Function_Reference/wp_enqueue_style

SO网友:Azodium

兰比洛提出的解决方案对我不起作用。我这样做了，现在没事了：

function my_theme_enqueue_styles() {
        wp_enqueue_style( \'name-child-style\', get_stylesheet_directory_uri() . \'/style.css\' );
    }
    add_action( \'wp_enqueue_scripts\', \'my_theme_enqueue_styles\', PHP_INT_MAX );

结束

小码农CODE

未使用的子主题CSS优先级问题！重要

相关推荐

定义不同于通过style.css的主题信息