スポンサード リンク
border-left-widthプロパティ
HTML要素の左の枠線の太さを指定できます使い方(書式)
セレクタ { border-left-width: 値; }
border-left-widthプロパティ
対応ブラウザ | |
適用できる要素 | 全てのhtml要素 |
子要素へのスタイルの継承 | しない |
プロパティの値 | 説明 |
単位 | px、emなどの単位 |
thin | 細い枠線 |
medium | 標準の太さの枠線。これが初期値、標準にしては太い |
thick | 太い枠線 |
実際の指定方法
p.hoge { border-left-width: 1px; /* 要素の左の枠線を1pxに指定 */ border-style: solid; /* 要素の枠線を実線で表示 */ }
p.hoge2 { border-left-width: 2px; /* 要素の左の枠線を2pxに指定 */ border-style: solid; /* 要素の枠線を実線で表示 */ }
p.hoge3 { border-left-width: 3px; /* 要素の左の枠線を3pxに指定 */ border-style: solid; /* 要素の枠線を実線で表示 */ }
p.hoge4 { border-left-width: 4px; /* 要素の左の枠線を4pxに指定 */ border-style: solid; /* 要素の枠線を実線で表示 */ }
p.hoge5 { border-left-width: 5px; /* 要素の左の枠線を5pxに指定 */ border-style: solid; /* 要素の枠線を実線で表示 */ }
html部分
<p class="hoge">border-left-width: 1px;</p> <br> <p class="hoge2">border-left-width: 2px;</p> <br> <p class="hoge3">border-left-width: 3px;</p> <br> <p class="hoge4">border-left-width: 4px;</p> <br> <p class="hoge5">border-left-width: 5px;</p>
実際の表示
border-left-width: 1px;
border-left-width: 2px;
border-left-width: 3px;
border-left-width: 4px;
border-left-width: 5px;