ホームページマスターTOPページへ
初心者の為のホームページ作成支援サイト powerd by Google
HOME >CSS一覧 >水平線

水平線に背景色や画像を指定する

hr{color:色;}で水平線の全体の色を指定することが出来ます。また、
hr{background-color:色;}で水平線の内側の色を指定することが出来ます。

【ブラウザ表示】





ソース

<hr class="sample1">
<hr class="sample2">

外部ファイル

hr.sample1{color:green;}
hr.sample2{
height:5px;
background-color:yellow;
}


<body>〜</body>に直接記入する場合

<hr style="color:green;">
<hr style="height:5px; background-color:yellow;">

■ 水平線に背景画像を指定する

hr{background-image:url(画像);}で水平線に背景画像を指定することが出来ます。 背景画像の細かな表示方法はボックスの 背景画像の表示方法を指定するの項目を参照して下さい。

【ブラウザ表示】




ソース

<hr class="sample3">

外部ファイル

hr.sample3{
height:8px;
background-image:url(../image/ichigo.gif);
}


<body>〜</body>に直接記入する場合

<hr style="height:8px; background-image:url(../image/ichigo.gif);">

■ その他の項目

水平線の横幅、高さを指定する
枠線の太さ、種類、色を指定する
水平線の表示位置を指定する
水平線の外側の余白を指定する

スタイルシート一覧のページに戻る

CSS一覧
テキスト
イメージ
テーブル
ボックス
リンク
リスト
水平線
フォーム
フレーム
ページ全体

HOME

Copyright (C) 2003-2012 ホームページマスター All rights reserved.