スタイルシート(CSS)講座 トップ >> レヴェルアップ練習問題 >> ボックスのサイズを定義してみよう

ボックスのサイズを定義してみよう

前回作成したボックスのサイズを定義してみましょう。
ボックスの設定は、横幅(width)200px縦幅(height)100px
定義の方法と場所は前回と同じ。

枠線とサイズを定義したボックス




横幅を定義するために必要な属性は、width
縦幅を定義するために必要な属性は、height
CLASSセレクタだから、次のように定義します。

.box {
   border:1px solid #CC0000;
   width: 200px;
   height: 100px;
}

1つのセレクタに2つ以上の属性を定義しています。
スペースが空いてて、不思議に思うかもしれないけど、
「;」で値の終わりを宣言するとこのようにに書き込めます。

そして、

<DIV CLASS="box">

枠線とサイズを定義したボックス

</DIV>

このように、HTML部分にカキコしてあげましょう。

<< 枠線を定義した<DIV>をつくってみよう

パディングの定義もプラスしてみよう >>

<< スタイルシート(CSS)講座 トップ