編集:base.css
賢威8のグローバルメニューの文字
賢威8のグローバルメニューですが、シンプルといえばシンプルですが、やや寂しい気もしませんか?
モバイルファーストなのか、PCでのビューは、少し物足りない部分もあるような気がします。
それでも、いろいろと自分好みにカスタマイズ出来るのが賢威の良い所。
今回は、そのグローバルメニューの文字を、少しだけカスタマイズしてみます。
文字を太くする
まず、この文字を太字にして、少しだけ目立つようにするには、以下のコードをbase.cssに加えます。
.keni-gnav_inner li a{
font-weight: bold;
}
【変更後】
文字を大きく
今度は、太字のままで、文字を大きくしてみます。
文字サイズを1.5倍にしてみますので、以下のコードをbase.cssに加えます。
.keni-gnav_inner li a{
font-weight: bold;
font-size: 1.5em;
}
【変更後】
かなりインパクトが増しました。
文字色を変更
更に、今度は色を変更してみます。
絶対やらないと思いますが、わかりやすいように文字を赤くしてみます。
以下のコードをbase.cssに加えます。
.keni-gnav_inner li a{
font-weight: bold;
font-size: 1.5em;
color : #ff0000;
}
【変更後】
まとめ
- グローバルメニューの文字を太くするには
Font-weight をboldに。
- 文字の大きさを変えるには
Font-size に倍率を指定。 1.5倍なら1.5em。逆に小さくするには0.7emなど。
- 文字の色を変えるには
Colorのあとにカラーコードを指定。
以上、賢威8のグローバルメニュー 文字のカスタマイズでした。