WEB MAGICテンプレート更新履歴

#15シリーズにおいて、左サイドのリンク全てに、テキストリンクボックスの指定が適用されてしまう不具合を解消しました。

●CSSファイルに何の変更も加えずに利用されている方
利用しているテンプレートのVer 1.01版をダウンロードして、style.cssファイルを差し替えてください。


●CSSファイルをすでにカスタマイズされている方
style.css内の以下の箇所を変更してください。

▼変更前
-------------------------------------------------------
/*左メニューにマウスをのせていないときの指定-----------------*/
#side a{
background-color:#F0F1E4;/*-------メニューの背景色----------*/
margin-bottom:4px;
padding:10px 10px;
display:block;
color:#444444;/*--文字の色----------*/
text-decoration:none;/*--下線なし----------*/
width:190px;
height:20px;
}


/*左メニューマウスをのせたときの指定-----------------*/
#side a:hover{
background-color:#f7f0c9;/*-------メニューの背景色----------*/
margin-bottom:4px;
color:#444444;/*--文字の色----------*/
text-decoration:none;/*--下線なし----------*/
}
-------------------------------------------------------


▼変更後
-------------------------------------------------------
/*左メニューにマウスをのせていないときの指定-----------------*/
#side li a{
background-color:#F0F1E4;/*-------メニューの背景色----------*/
margin-bottom:4px;
padding:10px 10px;
display:block;
color:#444444;/*--文字の色----------*/
text-decoration:none;/*--下線なし----------*/
width:190px;
height:20px;
}


/*左メニューマウスをのせたときの指定-----------------*/
#side li a:hover{
background-color:#f7f0c9;/*-------メニューの背景色----------*/
margin-bottom:4px;
color:#444444;/*--文字の色----------*/
text-decoration:none;/*--下線なし----------*/
}
-------------------------------------------------------

#13シリーズにおいて、下層ページに小見出しをつけました



小さな変更ですが、すでにダウンロードして利用している方で小見出しをつけたい方は、次のように変更してください。

●スタイルシート内の記述変更●
スタイルシートファイルの一番最後に以下の記述を加えてください。
それぞれのテンプレートに合わせて利用してください。

#13 Skylightの場合
-------------------------------------------------------
/*----下層ページ小見出し--------*/
h3{
font-weight:bold;
padding:2px;
font-size:14px;
color:#0b689a;/*----文字の色--------*/
margin-bottom:15px;
border-bottom:#dddddd double 3px;/*----下部ライン--------*/
}
-------------------------------------------------------

#13 Mascotの場合
-------------------------------------------------------

/*----下層ページ小見出し--------*/
h3{
font-weight:bold;
padding:2px;
font-size:14px;
color:#763111;/*----文字の色--------*/
margin-bottom:15px;
border-bottom:#dddddd double 3px;/*----下部ライン--------*/
}
-------------------------------------------------------

#13 Candleの場合
-------------------------------------------------------
/*----下層ページ小見出し--------*/
h3{
font-weight:bold;
padding:2px;
font-size:14px;
color:#217503;/*----文字の色--------*/
margin-bottom:10px;
border-bottom:#dddddd double 3px;/*----下部ライン--------*/
}
-------------------------------------------------------

#13 Lightの場合
-------------------------------------------------------
/*----下層ページ小見出し--------*/
h3{
font-weight:bold;
padding:2px;
font-size:14px;
color:#763111;/*----文字の色--------*/
margin-bottom:15px;
border-bottom:#dddddd double 3px;/*----下部ライン--------*/
}
-------------------------------------------------------

●HTML内の変更●
#13 の kasou.html　ファイルのソース内で小見出しを入れたい箇所に以下の記述を加えてください。（こちらはどのテンプレートでも同じです）

例えば、<div class="text">ああああああああああああ</div>
のテキストの前などに

<h3>小見出しのタイトルをここに入れます</h3>
<div class="text">ああああああああああああ</div>

<h3>小見出しのタイトルをここに入れます</h3>
<div class="text">ああああああああああああ</div>

のように。
1ページにリピートして使用できますので、
ページ内を小見出しで分けたい時に利用してください。