[ 解決済 ] スクロール時のナビゲーション背景色CSS設定

VWSとは フォーラム Lightning [ 解決済 ] スクロール時のナビゲーション背景色CSS設定

[ 解決済 ] スクロール時のナビゲーション背景色CSS設定

5件の投稿を表示中 - 1 - 5件目 (全5件中)
  • 投稿者
    投稿
  • #38621

    Hisashi Endo
    参加者

    lightning proを使用、ナビゲーションの背景色を追加CSSで下記のようにカスタマイズしました(ファイル1)。
    .siteHeader {
    background-color:#114fc5;
    }
    .siteHeader li a{
    color:#fcfcfc;
    }
    .siteHeader li:hover{
    background-color:#ffda69;
    }
    そうすると、スクロール時にナビゲーション時に背景色が白くなり、文字が読み取れなくなってしまいます。
    スクロール時のナビゲーション背景色CSS設定のためのクラス記述(「.siteHeader」の箇所、どのようにすれば良いでしょうか?

    Attachments:
    You must be logged in to view attached files.
    #38625

    DRILL LANCER
    モデレーター
    .siteHeader,
    .header_scrolled .gMenu_outer {
    background-color:#114fc5;
    }
    .siteHeader li a{
    color:#fcfcfc;
    }
    .siteHeader li:hover{
    background-color:#ffda69;
    }

    こんな感じにすれば改善されると思います。

    #38626

    Hisashi Endo
    参加者

    DRILL LANCERさん
    早速のご回答、ありがとうございます!
    無事、解決しました。
    追加で質問させていただいてよいでしょうか?
    スクロール時のナビゲーションの左右ボーダー(border-right、left)のカスタマイズ、どのように追記すればよいでしょうか?
    恐れ入りますが、よろしくお願いいたします。

    #38627

    DRILL LANCER
    モデレーター

    こんな感じですかね。(デフォルト指定)

    .header_scrolled .gMenu>li:last-child {
        border-right: 1px solid #f5f5f5;
    }
    
    .header_scrolled .gMenu>li {
        border-left: 1px solid #f5f5f5;
    }

    P.S.
    下記サイトを参考にしてください。

    全てのWordPressテーマで使える!デザインをピンポイントで変更する方法 〜親テーマのCSSは書き換えないで〜

    #38636

    Hisashi Endo
    参加者

    ありがとうございます。
    解決しました。

5件の投稿を表示中 - 1 - 5件目 (全5件中)
  • このトピックに返信するにはログインが必要です。