ホームページのコンテンツ(情報)を表示する領域を見てみましょう。
コンテンツ部の大きさはwidth(ウィズ)、height(ハイト)で表されます。
実際にやってみましょう。
コンテンツ部をwidth、heightで囲む
幅widthを50%、高さheightを160pxで 色で表示し、情報として下の文を入れてみます。
「竹取物語は、平安初期に著されたとされる、仮名による日本最古の物語。作者及び成立年は未詳。竹取の翁によって竹の中から見つけられた「かぐや姫」が、貴公子たちの求婚を次々と退け、帝の招聘も拒絶し、最後は月に帰ってしまう話。」
htmlソース
<!--====参考====--> <body> <div id="container"> <div class="sample_1"> <p>竹取物語は、平安初期に著されたとされる、仮名による日本最古の物語。作者及び成立年は未詳。竹取の翁によって竹の中から見つけられた「かぐや姫」が、貴公子たちの求婚を次々と退け、帝の招聘も拒絶し、最後は月に帰ってしまう話。</p> </div> </div><!--container--> </body>
cssソース
/*====参考====*/ .sample_1 { width: 50%; background: #fecfd8; text-align: left; margin: 0 auto; }
このhtmlソースとスタイルソースで表示すると、
竹取物語は、平安初期に著されたとされる、仮名による日本最古の物語。作者及び成立年は未詳。竹取の翁によって竹の中から見つけられた「かぐや姫」が、貴公子たちの求婚を次々と退け、帝の招聘も拒絶し、最後は月に帰ってしまう話。
コンテンツはwidth,heightで設定した領域(寸法)の中に入れますが、文字を入れる場合はheight(高さ)がどれだけになるのかわかりません。
実は、高さheightを省略すると自動的に高さheightを決めてくれます。
heightは自動的に決まるので文字を表示する場合はheightを書かない場合が多いです。