たまちゃんHTMLのおうち

ステップアップ！ホームページの作成

ステップ４

「たまちゃんHTMLのおうち」のステップアップでは、ここまでの表示ができます。

画像を貼ってみます。

見出し１にはbackground-imageプロパティで画像を埋め込みました。
背景にも同様に、画像を埋め込みました。画像さえ用意すれば簡単です。

■まだまだ続く？ステップアップ■

width、heightプロパティでピクセル数、または％で指定します。
％指定の場合は、親要素のサイズに対しての割合となります。
heightの％指定で気を付けなければならないのは、親要素がデフォルトのheight:auto;であった場合は 値を指定してもこの要素もheight:autoになってしまうため意味がありません。 このプロパティheightの値を有効にさせるためには、 html, body { height: 100%;}などと スタイルシートで親要素のプロパティheightを指定しなければなりません。

floatプロパティは、left・right・none を指定できます。left・rightを指定したときは、 反対側にテキストが回り込みます。 親のボックスから、画像がはみ出る場合があります。 その時は、親要素でoverflow: auto;を指定するか、clear: both;で回り込み解除を行うと解決します。

このページは、ブラウザの「閉じる」で閉じてください。