D班勉強会
2枚の写真を並べるレイアウト その２
説明つきリストdlを用いる
横方向に2枚の写真を並べるページのレイアウトをDLタグを用いて作成します。
- 使用する写真を偶数枚用意し、横幅を写真を並べるスペースの半分より20px小さいサイズにリサイズする。
例えば横幅740ピクセルのページ全体を用いる場合は350ピクセルとなる
（740÷2）-20=350 - ビルダーの編集画面で見出し、説明文入力する。
- 写真を挿入したい部分にカーソルを置き、メニューバーの「挿入」から「リスト」で「説明付リスト」をクリックする。
- 編集画面右側の「スタイルエクスプレス」 で「カーソルの位置」タブで「dl」を右クリックし、「ルールの新規作成」を選択する。
- 表れた「ルールの追加」ダイアログで、「タブ」を選択し「OK」をクリックする。
- 「位置」タブで「幅」を「50%」に、「属性」で回り込みを「左」を選択し、「文字のレイアウト」タブで「水平方向の配置」を「中央」を選択し「OK」をクリックする 。
- 編集画面に戻るので、用意した1枚目の写真を挿入し「ENTER」キーを押して写真の説明文を入力する。 （ｄｌタグの直下にddタグが作られる）
- ここで一旦ファイルを名前を付けて保存する。
- ソース部分で、画像を挿入したリスト（<ｄｌ>・・・・・</dl>）をコピーして、直下に貼り付ける。
- 貼り付けたボックスで写真のファイル名部分と説明文部分を書き換える。
- 以下同様にして用意した写真の数だけ繰り返す。
- 写真の後に「戻る」のリンク、フッター等を入れる場合は、回り込み解除の処理を行い上書き保存する。