グローバルナビゲーションの色
変更前
■■■■■ グローバルナビ .acms-navbar
.acms-navbar {
background-color: #333333;
border-top: solid 1px #333333;
border-bottom: solid 1px #333333;
リンク
2段目以降
}
.acms-navbar a:hover,
.acms-navbar #viewing {
background: #808080;
}
.acms-navbar .stay a,
.acms-navbar a:active {
background: #666666;
}
.acms-navbar ul ul a {
background: #333333;
}
.acms-navbar ul ul a:hover {
background-color: #808080;
}
.acms-navbar ul li.stay ul a {
background-color: #333333;
}
.acms-navbar ul li.stay ul a:hover {
background-color: #808080;
}
.acms-navbar .acms-module-edit a {
height: auto;
padding: 6px;
line-height: 1.5;
}
変更後
グローバルナビゲーションの親と子それぞれの色、ホバー中、クリック中の色を変更しました。
■■■■■ グローバルナビ .acms-navbar
.acms-navbar {
background-color: #deb887;
border-top: solid 1px #deb887;
border-bottom: solid 1px #deb887;
リンク
2段目以降
}
.acms-navbar a:hover,
.acms-navbar #viewing {
background: #d2b48c;
}
.acms-navbar .stay a,
.acms-navbar a:active {
background: #d2b48c;
}
.acms-navbar ul ul a {
background: #d2b48c;
}
.acms-navbar ul ul a:hover {
background-color: #d2b48c;
}
.acms-navbar ul li.stay ul a {
background-color: #d2b48c;
}
.acms-navbar ul li.stay ul a:hover {
background-color: #d2b48c;
グローバルナビゲーションとサイトの横幅を揃える
グローバルナビゲーションの横にはみ出た部分の色を、サイトの背景色と同じにして見た目を揃えます。
■■■■■ グローバルナビ .acms-navbar
.acms-navbar {
background-color: #ffffe0; ←グローバルナビゲーションの色をサイトの背景色と同じにする
border-top: solid 1px #ffffe0;
border-bottom: solid 1px #ffffe0;
}
.acms-navbar ul { ←中央部分の色を設定するコードを書き加える
background-color: #deb887; ←
} ←