Webページの表示を制御する非常に多くのHTMLタグを学習した後、読者は最初に純粋な記事ページを作成できます。このセクションでは、HTMLのリスト要素を学習します。リストフォームは、ウェブサイトのデザインの比較的大きな割合を占めており、表示情報は非常にきれいで直感的であり、ユーザーが理解しやすいです。リスト要素の高度な役割は、その後のCSSスタイルの学習で広範囲に使用されます。
4.4.1リストの構造構成HTMLのリスト要素は、リストタグで囲まれた構造であり、含まれるリスト項目は<li> </li>で構成されています。特定の構造を図4.17に示します。
4.4.2順序付けられていないリストの作成名前が示すように、順序付けられていないリストは、リスト構造のリスト項目に順序がないリストフォームです。ほとんどのWebアプリケーションは順序付けられていないリストを使用し、リストタグは<ul> </ul>です。ライティング方法は次のとおりです。
<ul>
<li>アイテムのリスト1 </li>
<li>アイテムのリスト2 </li>
<li>アイテムのリスト3 </li>
<li>アイテムのリスト4 </li>
<li>アイテムのリスト5 </li>
</ul>
4.4.3注文リストを作成します名前が示すように、順序付けられたリストとは、リスト構造のリスト項目に一連のリストがあることを意味します。上から下まで、1、2、3、またはA、B、Cなどのさまざまなシーケンス番号があります。D:/ Web/ディレクトリ(ul_ol.htmという名前のWebページファイルを作成し、コード4.17に示すようにコードを書きます。
コード4.17リスト設定:ul_ol.htm
<html>
<head>
<Title>リスト設定</title>
</head>
<body>
<フォントサイズ= 5>
Webフロントデスクテクノロジー
<ul>
<li> html </li>
<li> CSS </li>
<li> javascript </li>
<li>フラッシュ</li>
</ul>
Webバックグラウンドの学習
<ol>
<li> ASP </li>
<li> asp.net </li>
<li> php </li>
<li> CGI </li>
<li> ruby </li>
<li> python </li>
</ol>
</font>
</body>
</html>
ブラウザアドレスバーにhttp://localhost/ul_ol.htmを入力すると、閲覧効果を図4.18に示します。
図4.18リストの設定