HOME >> スタイルシート > 横幅と高さをを指定する

　横幅と高さをを指定する

■	width:(横幅)　height:(高さ）

指定できる値

スタイルシートでの単位指定

数値にptなどの単位をつけて指定する

キーワード

auto

パーセントで指定

widthプロパティでボックスの横幅を、heightプロパティでボックスの高さをそれぞれ指定することが出来ます。
HTMLでテーブルや画像の大きさを指定する場合に、width属性やheight属性を使いましたが、この場合と同じようにこのプロパティはボックスの大きさを指定することが出来ます。
大きさを具体的に設定する値には、数値にptなどの単位をつけて指定するほか、パーセントや、キーワードのautoで指定します。Netscape Navigator4.7では、widthプロパティは機能しますが、heightプロパティには、対応していません。

サンプル - Microsoft Internet Explorer

この段落の横幅は、100pxで高さは、100pxです。

この段落の横幅は、200pxで高さは、100pxです。

ソース

<HTML>
<HEAD>
<TITLE>サンプル</TITLE>
<STYLE type="text/css">
<!--
P     {background-color:orange;}
.test1 { width:100px ;
         height:100px; }
.test2 { width:100px; 
         height:200px;  }
-->
</STYLE>
</HEAD>
<BODY>
<P class="test1">
この段落の横幅は、100pxで
高さは、100pxです。
</P>
<HR>
<P class="test2">
この段落の横幅は、200pxで
高さは、100pxです。
</P>
</BODY>
</HTML>

HOME >>スタイルシート

次のページ >>