グローバールナビのデザインに、前のcss内容が影響してしまいます。

Simplicityの特徴 フォーラム テーマファイルのカスタマイズに関する質問など グローバールナビのデザインに、前のcss内容が影響してしまいます。

このトピックには4件の返信が含まれ、1人の参加者がいます。1 週、 1 日前 かうたっく さんが最後の更新を行いました。

  • 投稿者
    投稿
  • #57446

    torui

    こんにちは。
    いつもお世話になっております。
    一点質問よろしいでしょうか。

    グローバールナビのデザインをカスタマイズしております。
    子テーマのstyle.cssを使っているのですが、カスタマイズ前のcssの内容が影響してしまい、一部デザインが反映されない状態でいます。
    http://singer-mixer.com/

    本来は、グローバルメニューの各項目白いところも、青いグラデーションが入るはずなのですが、なぜかここだけ反映されません。
    子テーマのcssをカスタマイズする前に何かしないといけないことがあるのでしょうか?

    度々申し訳ありませんが、よろしくお願いいたします。

  • #57448

    かうたっく

    https://gyazo.com/4d29abc8da61a68ce2ce9da910a8ea38

    元のスタイルのCSS

    #navi ul {
    	border: 1px solid #ddd;
    	background-color: #F7F7F7;
    }

    リストulを囲っている#naviのスタイルが上記です。このスタイルを指定し上書きしてないからです。

    要素の検証を使って、指定した#naviを展開していくと分かりやすいです。良いリンクが紹介できない…><

    上記CSSのボーダーを消す場合は「border 初期値」を調べると「none」とわかります。前のcss内容を消したいから該当箇所をborder: none;と子テーマで追記。

    背景色は、今から変えたいので初期値に戻さなくてもOK!そのままstyle.cssに他の背景と同じ値を書き込めばOKです。

    そんな感じで変更していきます。

    #navi ul {
    	border: none;
    	background-color: #ほげほげ;
    }
  • #57449

    かうたっく

    リストulを囲っている#naviのスタイルが上記です。このスタイルを指定し上書きしてないからです。

    違った。ulを囲っている#naviのみスタイル指定しています。#naviにかこまれたulは元のスタイルのままだから灰色のままです。ulのスタイルを指定・上書きする必要があるけど、見落としているかんじですね。

    見落としを探すのに<div id="navi" …略のHTMLを確認➡確認するのに「要素の検証」が便利ですよ。

  • #57472

    torui

    ありがとうございます!
    無事解決できました。
    そもそもcssに書いていた自分の内容が間違っていました。
    イージーミスでした><

    ありがとうございます。
    今後ともよろしくお願いします。

  • #57476

    かうたっく

    無事解決されたようで❦
    お疲れさまでした^^

トピック「グローバールナビのデザインに、前のcss内容が影響してしまいます。」への新規返信追加は締め切られています。

スポンサーリンク
アドセンス(大)
アドセンス(大)