　ホームページはテキストが基本ですから画像も他の要素もテキスト文として取り扱われます。しかし単にテキストを記述順に並べるだけでは見る時に不便ですので、レイアウトを行うタグが用意されています。さらにHTMLのタグの中にはCSS（カスケードStyleSheet）というホームページをより見やすくする文法を付加することができるようになっています。ここではレイアウトに関するTABLEとDIVの二つのタグについて調べてみましょう。

DIVタグは単に段落を決めるだけで何もありませんが、属性のstyle=""で見易さを定義します。position:relativeは枠の位置を相対にし(position:absoluteは絶対位置)、leftとtopで指定します。widthとheightで枠の大きさを決め、z-indexで重なりの表示順（大きい数値ほど全面）を表します。border:1px solidは枠線表示です。
エデターだけで枠の位置決めは難しいのでDIVタグを使うときはWYSIWYGと言われるホームページ制作支援ツールが必要になります。 (ホームページビルダーの「標準モード」がタグベースで「どこでもモード」がDIVのスタイル方式となります。）
次の枠にはTABLEによるアルバムを入れてあります。

<div style="position:relative;
　　 width:874px; height:368px; z-index:-1;border:1px solid;" >//枠全体
<div style="position:relative;left:2px; top:6px; border: 1px solid;
　　width: 432px; height : 224px; z-index:1; ">//左の枠</div>
<div style="position:relative; left: 438px; top: -220px; border: 1px solid;
　　 width : 430px; height : 224px; z-index:1;">//右の枠</div>
</div>//全体枠終わり
<table style="position:relative;top:-130px;left : 7px;z-index:1; width:80%;">
</table>//アルバムを全体枠の中に入れる