ヘッダーメニューのホバーテキストと背景色の両方を変更するにはどうすればよいですか?

ヘッダーメニューのホバーテキストと背景色を変更するにはどうすればよいですか?
CSSは得意ではありません。

コードと、どこに配置すればよいか教えていただけると助かります。

@vinothkannans

@rickwatson 様、コードを添付します。色/背景色の値は、ご希望の外観に合わせて更新する必要があります。common.css タブに配置すると機能するはずです。

ヘッダーメニューの背景色:

.b-header {
   background-color: var(--tertiary);
}

リンク

.b-header .nav-pills li a {
    color: var(--secondary);
}

リンク(ホバー時)

.b-header .nav-pills li a:hover {
    color: #001aff;
    background-color: red;
}

color および background-color プロパティに指定できる値については、詳細をこちらでご確認ください。16進数カラーコード、rgba値、hsa値などを入力できます。

ただし、ダークモードのサポートなどを維持するために、可能な限り既存のCSS変数を使用することをお勧めします。

サイトに存在する変数と、それらがどの色に対応するかを調べるには、ブラウザの開発者ツールで確認してください:link: アクセス方法)

開いたら、<kbd>Styles</kbd> タブで :root セレクターの color_definitions.scss 内の宣言を確認してください。

「いいね!」 3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.