CSS(スタイルシート)入門講座4／ホームページ作成ビギナーズガイド

[PR]

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

h2、h3、h4タグ部分にborder(枠線)をつけてみます。
サンプルページ3のstyle部分に下記のように書き加えます。

<head>
（省略）
<style type="text/css">
<!--
（省略）

h2 {
font-size:130%;
border-left:10px solid #000099;
border-bottom:1px solid #000099;
margin:0 0 5px 0;
padding:0 0 0 10px;
}

h3 {
font-size:120%;
border-left:10px solid #3333cc;
margin:0 0 5px 0;
padding:0 0 0 5px;
}

h4 {
font-size:110%;
border-bottom:1px solid #3333ff;
margin:0 0 5px 0;
padding:0;
}

-->
</style>
</head>

h2タグ部分についての説明。
左の枠線：幅10ピクセル、形式は実線、色は#000099
下の枠線：幅1ピクセル、形式は実線、色は#000099
と指定しました。

h3、h4タグ部分については省略。

borderの詳しい指定の仕方はボーダーとほほのスタイルシート入門が参考になります。

見た目はこうなります。→サンプルページ4