php - 如何覆盖子主题中的 CSS 文件？

Question

有一个主题有各种 CSS 文件，我从那个主题创建了一个子主题。

然后我创建了一个新页面并添加了来自 functions.php 的 css 文件:

function my_theme_enqueue_styles() {
    if ( is_page_template( 'new-page.php' ) ) {
        wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
        wp_enqueue_style( 'page-template', get_stylesheet_directory_uri() . '/css/page-style.min.css');
    }
}

add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

因此，要为特定元素覆盖主题中的其他 CSS 文件，我必须使用 !important每次我想覆盖它们。

喜欢:

selector{
    property1: value !important;
    property2: value !important;
    ..
}
..

那么有没有办法在 </head> 之前包含该文件？例如什么的？

Answer 1

add_action('wp_enqueue_scripts', 'my_theme_enqueue_styles', PHP_INT_MAX);
    function my_theme_enqueue_styles(){

        wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
        wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/css/page-style.min.css', array('parent-style') );
    }

我在 function.php 中使用这段代码会起作用。通过这段代码，child theme 可以访问所有的parent theme css 并且可以添加新的 css 和覆盖父主题的 css。并且优先考虑child theme css。所以写 !important 是没有必要的。