border-top, -bottom, -left, -right

プロパティの説明

border-***は、上下左右の枠線の個々に対して、種類・太さ・色をまとめて指定することができるプロパティです。全ての要素に指定することができます。

指定できる値

以下の通り、枠線の種類・太さ・色の3つの値を半角スペースで区切って指定します。指定しなかった値には初期値が代入されるので注意してください。

枠線の種類（border-style）
none, solid, double, dotted, dashed, inset, outset, groove, ridge
枠線の太さ（border-width）
CSSで使える数値, thin, medium, thick
枠線の色（border-color）
CSSで定義された色の値, transparent

サンプル

サンプルページ

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "https://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">

<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <meta http-equiv="Content-Style-Type" content="text/css">
 <title>サンプルページ</title>
 <style type="text/css">
 <!--
 p{padding:5px 20px;}
 .b1{
 border-left:solid 5px #cccccc;
 border-bottom:solid 2px #cccccc;
 }
 -->
 </style>
</head>

<body>
 <h1>サンプルページ</h1>
 <p class="b1">枠線左と下に枠線の種類・太さ・色を指定。</p>
</body>

</html>