wordpress

WORDPRESS AFFINGER6のヘッダーメニューをカスタマイズ

WORDPRESS AFFINGER6のヘッダーメニューをカスタマイズ

テーマのカスタマイズの追加ＣＳＳへ下記コードを追加します

ヘッダーメニューの両脇に区切り線を作る方法

header .smanone ul.menu li{
	border-left: 1px solid #fff;
  	border-right: 1px solid #fff;
}

重なった部分が太くなるので追加

header .smanone ul.menu li + li{
	border-left: none;
}

右側に縦線を追加する

header .smanone ul.menu li:last-child{
	border-right:1px solid #fff;
}

ヘッダーメニューを中央に寄せる方法

#st-menuwide{
	display:flex;
	justify-content:center;
}

ヘッダーメニューの色を変更する

#st-menubox{
   background-color:blue;
}

header .smanone ul.menu li a{
	color:#fff;
}

メニューの色を変えたい場合は、 st-menubox のbackground-colorを好みの色に変更してください。
また、文字色を変更したい場合は、 header .smanone ul.menu li a のcolorを変更してください。

ヘッダーメニューの色をホバーしたときに反転させる方法

header .smanone ul.menu li a:hover{
	background-color:#fff;
	color:#38b48b;
}

-wordpress

PAGE TOP