Wordpress 表示しているメニューの一部にcssを適用させる

Question

いつもお世話になっております。

現在WordpressでWebページを作成しております。
テーマはLightningを使用しており、子テーマを作成し、その中でstyle.css、javascript.jsを読み込ませています。

ホーム、ニュース、ブログを固定ページで作成し、それをメニューとして表示している状態です。
外観→メニューのメニュー構造のナビゲーションラベルに

<span class="under">ホーム</span></br>Home

と書いている状態です。

この状態で、ホーム画面が表示されたときにメニューの「ホーム」に下線をつけたく、下記cssを適用させたいと考えております。

.under {
text-decoration : underline;
}

同様に他のページが表示された場合も対応するページが表示された場合に、対応するメニューの一部に下線をつけたいと考えております。

どのようにページを判断しcssを適用すればいよいのでしょうか。

参考になるサイトでも構いませんので、適切な方法をご教示いただけますと幸いです。
よろしくお願いいたします。

Comments

[kei344]

過去の質問について、「解決済」になっていないものが多数見受けられます。解決したものは「ベストアンサー」を選び、自力で解決した場合はその方法を解答欄に書き、もし万が一解決していないのであれば質問を編集するなどしてみてください。

Answer 1

子テーマのフォルダ内にcustom.cssを新たに作成し、headerでis_front_page()などで条件分岐させ、custom.cssを読み込ませることで解決いたしました。