メニュー関連のカスタマイズ
シリウスニューテンプレートの見出しやメニューのデザインは、基本カラーで統一されて
いますが、コンテンツか、その他何かしらの事情により...どこかしら好みの色合いを
主張できないか？
とは、いつしかめぐり合うことかと理解しますので、そんなときのカスタマイズ事情..
シリウスニューテンプレートは、前バージョンと異なり画像を世も混ませる仕様が
少なくなっており、スタイルシートでのCSS指定により、見出しフォントや背景..
サイドメニュー背景を簡単に変更できるのですね
では、一例を見てみましょう
スタイルシート内に置かれる以下の箇所...各項目ごとにカラーコードを書き換えれば
即座に切り替えが確認できる...
#FF0A0Aのコードにしておりますが、書き換えてください...
*/ 一番上に表示されるｈ１タイトル/*
#top h1 a {
color: #FF0A0A;
text-decoration: none;
}
*/ ヘッダータイトル/*
#header .title a {
color: #FF0A0A;
text-decoration: none;
}
*/ グローバルナビ背景/*
#topmenu ul a {
background-color: #FF0A0A;
border-top: 1px solid #3b689b;
color: #fff;
display: block;
font-size: 13px;
line-height: 1.6;
padding: 15px 35px 15px 15px;
position: relative;
text-align: left;
text-decoration: none;
margin:0;
}
*/ ｈ２ h３見出し背景/*
#main h2,
#main h3 {
background-color: #FF0A0A;
border-bottom: 1px solid #fff;
border-radius: 3px;
-webkit-box-shadow: 1px 1px 3px #888;
box-shadow: 1px 1px 3px rgba(0,0,0,.3);
color: #fff;
font-size: 18px;
line-height: 1.5;
margin: 0 0 10px 0;
padding: 15px;
position: relative;
clear:both;
}
*/ ｈ２ h３見出し背景/*
/* メニュー
==================================================
*/
#menu,
#rmenu {
background-color: #FFF;
overflow: hidden;
padding: 30px 10px 0;
text-align: left;
box-sizing: border-box;
}
#menu h4,
#rmenu h4 {
color: #333;
background-color: #FF0A0A;*/ ｈ２ h３見出し背景はこの行です/*
border-top: 1px solid #ddd;
border-right: 1px solid #ddd;
border-bottom: 3px solid #237db9;
border-left: 1px solid #ddd;
margin: 0;
position: relative;
margin: 0;
padding: 11px 15px 11px 10px;
position: relative;
overflow: hidden;
}
/*
今日はここまで..後ほど追記いたします
