Web ページの HTML コードの説明: 順序付きリストと順序なしリスト

このセクションでは、HTML のリスト要素について学習します。リストは、Web サイトのデザインにおいて比較的大きな割合を占めています。リストは情報を非常にわかりやすく直感的に表示し、ユーザーが理解しやすいようにしています。以降の CSS スタイルの学習では、リスト要素の高度な機能が広範囲に使用されます。
データを整理するために使用されるリスト Web ページの表示を制御する多くの HTML タグを学習した後、読者は純粋な記事ページを作成し始めることができます。このセクションでは、HTML のリスト要素について学習します。リストは、Web サイトのデザインにおいて比較的大きな割合を占めています。リストは情報を非常にわかりやすく直感的に表示し、ユーザーが理解しやすいようにしています。以降の CSS スタイルの学習では、リスト要素の高度な機能が広範囲に使用されます。
テキストボックス: 図 4.17 リスト要素の構造

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\ ディレクトリに Web ページファイルを作成し、ul_ol.htm という名前を付け、コード 4.17 に示すようにコードを記述します。
リスト設定: ul_ol.htm
<html>
<ヘッド>
<title>リスト設定</title>
</head>
<本文>

Webフロントエンド技術
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
<li>フラッシュ</li>
</ul>
ウェブバックエンド学習
<オル>
<li>ASP</li>
<li>ASP.net</li>
<li>PHP</li>
<li>CGI</li>
ルビー
パイソン
</ol>

</本文>
</html>
ブラウザのアドレスバーに http://localhost/ul_ol.htm と入力すると、図 4.18 のようなブラウジング効果が表示されます。