
ホームページのコンテンツ(情報)を表示する領域を見てみましょう。
コンテンツ部の大きさは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を書かない場合が多いです。
