h3,h4,h5,h6をテンプレートのスタイルシートの中に指定する

 このブログはh3,h4h5,h6の項目を時々ブログの記事の中で使っている。

 h1,h2はもともとテンプレートで使っているので、スタイルシートにもその設定があるのだが、h3、h4,h5,h6は使われていないので、テンプレート内のスタイルシートの設定がない。

 この際だからh3,h4,h5,h6のスタイルシートをテンプレートのスタイルシートの中に指定してみようと思う。


h3,h4,h5,h6のスタイルシートをテンプレートのスタイルシートの中に指定

h3{
font-size : 16px;FONT-WEIGHT: bold;
BORDER-BOTTOM: #008040 1px ridge; BORDER-LEFT: #008040 1px ridge; PADDING-LEFT: 5px; COLOR: #008000;
}
h4{
BORDER-BOTTOM: 1px ridge; BORDER-LEFT: 1px groove; PADDING-LEFT: 10px; COLOR: #ff0000; FONT-SIZE: 15px; FONT-WEIGHT: bold;
}
h5{
BACKGROUND-COLOR: #008000; PADDING-LEFT: 10px; BORDER-BOTTOM-WIDTH: 1px; COLOR: #ecffe1; BORDER-LEFT-WIDTH: 1px; FONT-WEIGHT: bold;FONT-SIZE: 14px;
}
h6{
 BACKGROUND-COLOR: #008040; PADDING-LEFT: 10px; BORDER-BOTTOM-WIDTH: 1px; COLOR: #ecffe1; BORDER-LEFT-WIDTH: 1px; FONT-WEIGHT: bolder;FONT-SIZE: 13px;
}

 それぞれのスペルは、小文字のほうがいいんだけど・・・。

 使っているソフトの関係で、大文字。

  見本は↓

h3のスタイルシートは、このように指定してあります

h4のスタイルシートは、このように指定してみました

h5のスタイルシートは、このように指定してみました。

h6のスタイルシートはこのように指定してみました。

スポンサーリンク

シェアする

フォローする