我也有同样的问题,epilektric的回答让我走上了正确的道路。
我正在使用“function”wootheme,它需要加载父样式。css位于另一个称为布局的父css之前。css。因此,在加载子主题的样式时,需要保持此顺序。css。
所以基本上,为了避免使用!important
要覆盖所有样式,我们需要按以下顺序加载样式文件:
父主题的样式。css父主题的布局。css子主题的样式。css要实现这一点,我们需要改变:
儿童主题的风格。css子主题的功能。php子主题的样式。css更改此文件以按正确顺序导入父主题的两个css文件:
@import url("../function/style.css");
@import url("../function/css/layout.css");
子主题的功能。php,然后将其添加到函数中。php以避免重新加载布局。css(woo布局)和避免加载子主题的css(style.css):
if ( ! function_exists( \'woo_load_frontend_css\' ) ) {
function woo_load_frontend_css () {
// comment this, as we will be loading this css with a different priority
//wp_register_style( \'theme-stylesheet\', get_stylesheet_uri() );
// we can register the style here for future manipulation...
wp_register_style( \'woo-layout\', get_template_directory_uri() . \'/css/layout.css\' );
// comment this, as we will be loading this css with a different priority
//wp_enqueue_style( \'theme-stylesheet\' );
// ... but we will not be enqueuing it, instead we will import it in the child theme\'s style.css
//wp_enqueue_style( \'woo-layout\' );
} // End woo_load_frontend_css()
}
您也可以像这样加载一个空函数以达到相同的效果:
if ( ! function_exists( \'woo_load_frontend_css\' ) ) {
function woo_load_frontend_css () {
} // End woo_load_frontend_css()
}
然后注册并添加子主题的css,将其添加到子主题的函数中。php文件位于上一个
function woo_load_frontend_css
:
function cherrypick_child_enqueue_css()
{
wp_register_style( \'theme-stylesheet\', get_stylesheet_uri() );
wp_enqueue_style( \'theme-stylesheet\' );
}
add_action( \'wp_enqueue_scripts\', \'cherrypick_child_enqueue_css\', 99 ); // using priority 99 we make sure the child theme style.css will be loaded after all other css
现在,所有样式表文件都将按正确的顺序加载。