border: ***;

ブラウザ
  • IE
  • Cr
  • Sf
  • Fx
  • O
プロパティ

border は、境界線の太さ、色、スタイルを指定するプロパティです。

境界線関連のプロパティをhr要素に対して設定すると、様々なタイプの水平線を作ることができます。


hr {
border: 1px #ff0000 solid;
background-color: #ffdfe2;
height: 10px;
}
プロパティ名 値 説明
border 太さ、色、スタイル 境界線（太さ、色、スタイル）を指定

境界線の指定方法については、境界線の設定をひとまとめに行うをご覧ください。

使用例


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>文書のタイトル</title>

<style type="text/css">

hr {
margin-bottom: 15px;
}

hr.example1 {
height: 10px;
background-color: #ffdfe2;
border: 1px #ff0000 solid;
color: #ffdfe2;
}

hr.example2 {
height: 10px;
background-color: #ff8080;
border: 2px solid;
border-color: #c40000 #ffdfe2 #ffdfe2 #c40000;
color: #ff8080;
}

hr.example3 {
height: 2px;
border: none;
border-top: 2px #000000 dotted;
}

hr.example4 {
height: 1px;
border: none;
border-top: 1px #000000 dashed;
}

hr.example5 {
height: 1px;
border: none;
border-top: 1px #000000 solid;
}

</style>

</head>
<body>

<hr class="example1">

<hr class="example2">

<hr class="example3">

<hr class="example4">

<hr class="example5">

</body>
</html>
表示例