WordPress的 - 覆盖主题CSS样式表

我第一次使用WordPress的html5blank主题。我已经从style.css文件中删除了所有内容，并将其复制到我的样式和骨架网格中。我已经离开了normalize.css文件。我得到了我的大部分风格应用但不是全部，并且不知道为什么会这样。通过举例的方式，这是我的主页用自己的前端文件顶部 -WordPress的 - 覆盖主题CSS样式表

这是WordPress版本 -

我如何确保我的自定义CSS样式始终适用于所有情况？我研究过儿童/父母的主题，但我的理解是，这不是/不应该是这个主题的问题，因为它几乎是一个空壳。

我有这样的代码在我的header.php文件的头 -

<!doctype html> 
<html <?php language_attributes(); ?> class="no-js"> 
    <head> 
     <meta charset="<?php bloginfo('charset'); ?>"> 
     <title><?php wp_title(''); ?><?php if(wp_title('', false)) { echo ' :'; } ?> <?php bloginfo('name'); ?></title> 

     <link href="//www.google-analytics.com" rel="dns-prefetch"> 
     <link href="<?php echo get_template_directory_uri(); ?>/img/icons/favicon.ico" rel="shortcut icon"> 
     <link href="<?php echo get_template_directory_uri(); ?>/img/icons/touch.png" rel="apple-touch-icon-precomposed"> 
     <link rel="stylesheet" href="<?php bloginfo('stylesheet_directory')?>/style.css" /> 
     <link href='https://fonts.googleapis.com/css?family=Merriweather+Sans:100,200,400,700,700i,800,800i' rel='stylesheet' type='text/css' /> 
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> 


     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <meta name="description" content="<?php bloginfo('description'); ?>"> 

     <?php wp_head(); ?> 
     <script> 
     // conditionizr.com 
     // configure environment tests 
     conditionizr.config({ 
      assets: '<?php echo get_template_directory_uri(); ?>', 
      tests: {} 
     }); 
     </script> 

    </head> 
    <body <?php body_class(); ?>> 
<!--- header code --->

我看着在开发工具和body_class似乎有一些应用样式 - 可这种被删除？

这是styles.php文件中的内容，但我不确定我添加的内容是否有任何影响。

的functions.php

// Load HTML5 Blank styles 
function html5blank_styles() 
{ 
    wp_register_style('normalize', get_template_directory_uri() . '/normalize.css', array(), '1.0', 'all'); 
    wp_enqueue_style('normalize'); // Enqueue it! 

    wp_register_style('html5blank', get_template_directory_uri() . '/style.css', array(), '1.0', 'all'); 
    wp_enqueue_style('html5blank'); // Enqueue it! 
} 

// MW stylesheets 
function load_styles() 
{ 
    wp_register_style('styles', '/style.css'); 
    wp_enqueue_style('styles', '/style.css'); // Enqueue it! 
    add_action('wp_enqueue_scripts', 'load_styles'); 
}

而这正是我在我的CSS文件的顶部 -

的style.css

/* 
Theme Name: html5blank-stable 
Description: HTML5 Blank theme 
Template: html5blank-stable 
Author: MikeWhitehead00 
*/

来源

2017-07-18 Mike.Whitehead

'get_template_directory_uri（）'会从父主题，'get_stylesheet_directory_uri（）获取样式表'将获得从子主题 – Morpheus

@Morpheus所以你在说什么？我需要删除头部中所有对模板目录的引用？ –

没有。我想说的是，如果你想覆盖父主题风格，你需要使用'get_stylesheet_directory_uri（）'。 – Morpheus

这是正确的方式在你的孩子主题中包含一个CSS。

复制并粘贴到您的function.php顶部此功能

function override_css(){ 
    wp_enqueue_style('custom_css_name', get_stylesheet_directory_uri().'/style.css'); 
} 

add_action('wp_head', 'override_css');

来源

2017-07-18 10:21:56 Gianno

custom_css_name是什么意思？我没有添加自定义名称 –

这没有奏效。 –

WordPress的 - 覆盖主题CSS样式表

回答

相关问题