web-dev-qa-db-ja.com

Asset/css/main.cssにある親Styleスタイルをオーバーライドしない子Style.css

私はこの質問が以前に尋ねられたことを知っています、そして私はすでにここで次の質問を参照しました：

親テーマをオーバーライドしない子テーマ

子テーマcss内のいくつかのものが親をオーバーライドしない

子テーマのCSSが親テーマをオーバーライドしていない[クローズ]

子テーマの関数が親テーマの関数をオーバーライドしていない[複製]

これらのどれも私の特定の問題に対処していません。

私が抱えている問題は、私の親テーマのスタイルシートが伝統的なthemedirectory/style.cssにないということです。彼らはすべてのスタイリングをthemedirectory/assets/css/main.cssで行いました。そこで私は子テーマを作成しようとし、私のfunctions.phpファイルに次のコードを追加しました：

<?php
function my_theme_enqueue_styles() {

    $parent_style = 'maya-reloaded-style';
        wp_enqueue_style( $parent_style, get_template_directory_uri() . 'assets/css/main.css' );
        wp_enqueue_style( 'child-style',
            get_stylesheet_directory_uri() . '/style.css',
            array( $parent_style ),
            wp_get_theme()->get('Version')
        );
    }
    add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
    ?>

親テーマのディレクトリを現在の親テーマの場所に更新しましたが、新しいスタイルシートで親の子テーマが上書きされないという問題があります。親のスタイルシートが子のスタイルシートの後にロードされているようです。 Firefoxで要素を調べると、親スタイルシートが子スタイルシートを上書きしていることがわかります。

何が間違っていますか？また、子スタイルシートが親スタイルシートの後に読み込まれるようにこれを修正するにはどうすればよいですか？

UPDATE

これは _ parent _ （main.css）ファイルです。

/*
Theme Name: Maya Reloaded
Description: Onepage, Multipage and Mutipurpose WP Theme
Theme URI: http://themeforest.net/user/unCommons/portfolio
Author: unCommons Team
Author URI: http://www.uncommons.pro
Version: 1.1
License: GNU General Public License version 3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Tags: one-column, two-columns, right-sidebar, fluid-layout, custom-menu, editor-style, featured-images, post-formats, translation-ready
*/


/* Main Style -> assets/css/main.css */

これは _ child _ （style.css）ファイルです。

/*
 Theme Name:   Maya Reloaded - Child
 Theme URI:    http:www.girlpowerhour.com/Maya-child
 Description:  Child theme for the Maya Reloaded theme
 Author:       Me
 Author URI:   http:www.virgsolutions.com
 Template:     maya-reloaded
 Version:      2.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready, pink
 Text Domain:  maya-reloaded-child
*/

body{
    font-size:18px;
}

.larger-font{
    font-size:18px;
}

.about-header{
    font-size:24px;
}

/* Header */
.un-header-menu-white .main-menu  li  a{
    color:#EF1066;
}
themeschild-themestylesheet
1
Blaine

それはおそらく、それらのスタイルシートのルールがより高い特異性を持っているためです。あなたのCSSルールの1つの後に!importantを追加して、それがうまくいくかどうか確かめてください。

あなたがしなければ!importantを使ってはいけませんが、それが問題なのかどうか教えてくれるでしょう。

もしそうなら、この記事を読んでください： https://www.smashingmagazine.com/2007/07/css-specificity-things-you-should-know/

1
Jonathan Hodgson

以下を使ってみてください。 add_action（）呼び出しで優先順位を追加し、それが問題を解決するかどうかを伝えます。

add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles', 99 );
0
Desperado