STINGER3 : ナビゲーションをカスタマイズしよう

ナビゲーションのカスタマイズ

ナビゲーションとは、ぼくのブログでは、以下の黄色の部分のことです。
この部分をカスタマイズする方法を紹介します。

ぼくのナビゲーションのCSSのコードはこれです。

#navi-in{
background:#ffff00;
}
#navi-in li {
	position: relative;
	float: left;
	font-size: 13px;
	padding-left: 10px;
	display: inline;
	padding-right: 10px;
	border-left-width: 1px;
	border-left-style: dotted;
	border-left-color: #CCC;
	padding-top: 5px;
	padding-bottom: 5px;
        font-weight: bold;
}
#navi-in li li {
	float: left;
	font-size: 13px;
	padding-left: 10px;
	display: inline;
	padding-right: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
	border: none;
}
#navi-in li a {
	float: left;
	color: #333;
	text-decoration: none;
}
.menu-navigation-container {
	overflow: hidden;
}
#navi-in li a:hover {
	text-decoration: underline;
}
#navi-in li a:hover {
        color:#000;
}
#navi-in li:hover {
    background-color:#87cefa;
}

後は、これを外観→テーマ編集→style.css内のナビゲーション内の記述と入れ替えればＯＫ。