WordPress儿童CSS与父母冲突

时间:2018-07-16 22:45:22

标签: css wordpress themes

仅将我的子主题的样式表中的某些样式应用于我的网站,而忽略其他样式,并应用我的父主题的样式。有什么想法吗?

子主题的功能。php

<?
   add_action ('wp_enqueue_scripts', 
   'senorpicoculinary_child_and_parent_stylesheets');

function senorpicoculinary_child_and_parent_stylesheets() {
    wp_enqueue_style( 
        'parent-style',
        get_template_directory_uri().'/assets/stylesheet.css'); 

    /* For the child style, I didn't use get_directory_uri() because
       that seems to point to style.css, and our styling file is stylesheet.css*/
    wp_enqueue_style( 
        'child-style',
        get_stylesheet_directory_uri().'/assets/stylesheet.css'); 
}
?>

父主题函数.php

function add_theme_scripts() {
  wp_enqueue_style( 
        'generic-style',
    get_stylesheet_directory_uri().'/style.css');
    wp_enqueue_style( 
      'favicon',
      get_template_directory_uri().'/favicon.ico');
  wp_enqueue_style( 
        'bootstrap',
    get_template_directory_uri(). '/assets/bootstrap.min.css');
  wp_enqueue_style( 
        'megamenu-stylesheet',
        get_template_directory_uri(). '/assets/megamenu.css');  
  wp_enqueue_style( 
        'webfont-kit',
    get_template_directory_uri().'/assets/MyFontsWebfontsKit.css'); 

  wp_enqueue_style( 
        'tv-style',
        get_template_directory_uri().'/assets/stylesheet.css');  

}
add_action( 'wp_enqueue_scripts', 'add_theme_scripts' );
?>

儿童主题CSS:

h1 {
    font-family: 'momoco_inlineinline';  //doesn't work
    color: blue; //works
}

body {
    background-color: black; // doesn't work
  }

父主题CSS (全部应用,而不是我子主题的样式)

h1 {
  font-size: 1.4em;
  margin: 0 0 .5em 0;
  font-family: AvenirLT-Roman;
  border-bottom: 1px solid #CCCCCC;
}
body {
  background-color: #F1F1F1;
  margin: 0;
  padding: 0;
  font-size: 100%;
  font-family: AvenirLT-Roman;
}

1 个答案:

答案 0 :(得分:-1)

我会提前通知您,这不是最佳实践,但是我和许多Web开发人员都这样做。 使用!important强制某些属性。

例如:

h1 {
    font-family: 'momoco_inlineinline' !important;  //this will work ;)
    color: blue; //works
}

body {
    background-color: black !important; // this too :)
  }

理想情况下,您可能想找出导致这种情况发生的原因,并可能更改您的工作流程。