教科書2冊共に無かったので、今日はdlを徹底的に。

dlとは「定義リスト」です。
定義リストでは、dlの中にdt(定義する用語のリスト)と、dd(用語の説明のリスト)が必ず対になってマークアップされているリストの固まりの事です。
tableじゃ駄目なの?何故なら定義リストなので HTML 文章の論理構造が保たれます。つまり、検索エンジンが理解できる構文になっているのでSEO的によろしいという事です。

htmlに10通りのスタイルを当てる演習をします。

こちらの演習問題ページにあるdl001〜dl010の出来上がり見本の画像の様にcssをコーディングしなさい。cssはhead内に記述し、htmlはそれぞれ、問題の名前にしなさい。(例 dl001.html)

受講生用問題 dl問題集

いつものパスワードで進入しなさい。

dl001〜dl006は共通のhtmlです。

<dl>
  <dt>Internet Explorer</dt><dd>Microsoft 社で開発されたブラウザ</dd>
  <dt>Mozilla Firefox</dt><dd>オープンソース環境で開発されたブラウザ</dd>
  <dt>chrome</dt><dd>googleが開発したブラウザ</dd>
</dl>

dl007はdt1に対するddが2個、dt2に対するddが3個です。
テーブルの様に、dtをマージする必要はありません。
以下のようなとてもシンプルな構文です。

<dl>
	<dt>dt1</dt>
	<dd>dd1<br>dd1(2行目)</dd>
	<dd>dd2</dd>
	<dt>dt2</dt>
	<dd>dd3<br>dd3(2行目)</dd>
	<dd>dd5</dd>
</dl>

dl008は006までと同じ、シンプルなdlなのでhtmlもコーディングしてください。

使用画像のURLです。ダウンロードして使用して下さい。
【dl003 】 list2.gif
【dl006】 bg_dt_blue.gif bg_dt_orange.gif bg_dt_pink.gif bg_dd.gif