ゼロからはじめるホームページ作成 
HOME > スタイルシート講座 > 枠線を設定する(1)

枠線を設定する(1)

borderで枠線を設定することができます。

枠線の太さ、枠線の種類、枠線の色の順で設定します。

枠線の種類には、none(線なし)solid(実線)double(二重線)dashed(点線)dotted(破線)groove(へこんだ線)ridge(浮き上がった線)inset(内側がへこんだ線)outset(内側が浮き上がった線)が設定できます。

■スタイルシートの単位
■色を指定する方法

<div style="border:5px none orange">noneの設定</div></br>
<div style="border:5px solid orange">solidの設定</div></br>
<div style="border:5px double orange">doubleの設定</div></br>
<div style="border:5px dashed orange">dashedの設定</div></br>
<div style="border:5px dotted orange">dottedの設定</div></br>
<div style="border:5px groove orange">grooveの設定</div></br>
<div style="border:5px ridge orange">ridgeの設定</div></br>
<div style="border:5px inset orange">insetの設定</div></br>
<div style="border:5px outset orange">outsetの設定</div></br>

結果

noneの設定

solidの設定

doubleの設定

dashedの設定

dottedの設定

grooveの設定

ridgeの設定

insetの設定

outsetの設定


まとめ

  • 枠線はborderで設定する。
  • 枠線の太さ、枠線の種類、枠線の色の順で設定する。


スタイルシート講座

初心者講座

スポンサードリンク

スタイルシート辞典

テキスト
フォント
背景
ボックス
配置
リスト
テーブル
ユーザインタフェース
その他



Copyright© ゼロからはじめるホームページ作成講座 All Rights Reserved.  サイトマップ