線の太さ border-width
Yahoo!ブックマークに登録
はてなブックマークに登録
livedoorに記事をクリップ| 線の太さ （詳細情報） | |
|---|---|
| 字体 |
border-width:★; 線の太さをまとめて指定。 border-top-width:★; 線の太さを上だけ指定。 border-left-width:★; 線の太さを左だけ指定。 border-right-width:★; 線の太さを右だけ指定。 border-bottom-width:★; 線の太さを下だけ指定。 |
| 指定 |
★の部分に下記の「 」内 の効果を指定していきます。
|
| 効果 | ボックスの枠線の太さを指定することができる。 |
| 例１ | <div style="border-style: solid; border-width: 1px;">ホームページの素材屋です</div> |
| 結果 | ホームページの素材屋です |
| 例２ | <div style="border-style: double; border-width: 3px;">ホームページの素材屋です</div> |
| 結果 | ホームページの素材屋です |
| 例３ | <div style="border-style: groove; border-width: 8px;">ホームページの素材屋です</div> |
| 結果 | ホームページの素材屋です |
| 例４ | <div style="border-style: dotted; border-width: 6px;">ホームページの素材屋です</div> |
| 結果 | ホームページの素材屋です |
| 例５ | <div style="border-style: solid; border-left-width: 30px;">ホームページの素材屋です</div> |
| 結果 | ホームページの素材屋です |
| 例６ | <div style="border-style: solid; border-width: 1px 12px; text-align: center; padding: 8px;">ホームページの素材屋です</div> |
| 結果 | ホームページの素材屋です |
CSS辞典
- HTML辞典はこちら
- 【 文字CSS 】
- 色指定CSS
- 文字サイズCSS
- 文字を太字CSS
- 文字を斜体CSS
- 文字種類CSS
- 文字装飾CSS
- 大小文字CSS
- スモールキャップCSS
- 【 文章CSS 】
- 文章の行間CSS
- 文字間隔CSS
- 単語の間隔CSS
- 禁則処理CSS
- 単語の改行処理CSS
- 縦書きCSS
- 文字・行間隔CSS
- 一行目余白CSS
- 見たまま表示CSS
- 【 リストCSS 】
- リストマーク変更CSS
- マーク代理画像CSS
- マーク位置CSS
- リストまとめ指定CSS
- 【 スクロールCSS 】
- スクロール付きCSS
- スクロールバー色CSS
- 【 表示位置CSS 】
- 横の表示位置CSS
- 縦の表示位置CSS
- 左右の回り込みCSS
- 回り込み解除CSS
- 【 余白CSS 】
- 中身の余白CSS
- 外側の余白CSS
- 【 エリア幅CSS 】
- 横幅を指定
- 縦幅を指定
- 【 ボックスCSS 】
- 背景色を指定CSS
- 背景画像を指定CSS
- 線の種類CSS
- 線の太さCSS
- 線の色CSS
- 線をまとめて指定CSS
