コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > htmlチュートリアル > Web ページの HTML 順序付きリスト ol と順序なしリスト ul の詳細な説明

Web ページの HTML 順序付きリスト ol と順序なしリスト ul の詳細な説明

高洛峰
リリース： 2017-03-10 13:23:00
オリジナル
3650 人が閲覧しました

この記事では、Web ページの HTML の順序付きリスト ol と順序なしリスト ul について詳しく説明します

データを整理するために使用されるリスト Web ページの表示を制御する非常に多くの HTML タグを学習した後、読者は最初に純粋な記事ページを作成できるようになります。このセクションでは、HTML のリスト要素について説明します。リスト フォームは、Web サイトのデザインにおいて比較的大きな割合を占め、表示される情報は非常にわかりやすく、ユーザーにとって理解しやすいものです。次の CSS スタイルの学習では、リスト要素の高度な機能を多用します。

データを整理するためのリスト

Web ページの表示を制御する非常に多くの HTML タグを学習した後、読者は最初に純粋な記事ページを作成できるようになります。このセクションでは、HTML のリスト要素について説明します。リスト フォームは、Web サイトのデザインにおいて比較的大きな割合を占め、表示される情報は非常にわかりやすく、ユーザーにとって理解しやすいものです。次の CSS スタイルの学習では、リスト要素の高度な機能を多用します。

Web ページの HTML 順序付きリスト ol と順序なしリスト ul の詳細な説明

4.4.1 リストの構造構成

HTMLのlist要素はlistタグで囲まれた構造であり、含まれるリスト項目は

  • で構成されます。具体的な構造を図 4.17 に示します。

    4.4.2 順序なしリストの作成

    名前が示すように、順序なしリストは、リスト構造内のリスト項目が順番に並んでいないリスト形式です。 Web アプリケーションのほとんどのリストは順序なしリストを使用し、そのリスト タグは

      を使用します。記述方法は次のとおりです。

    • リスト アイテム 2

    • リスト アイテム 3

    • リスト アイテム 4

    • リスト アイテム 5 li>

      4.4.3 順序付きリストの作成Web ページの HTML 順序付きリスト ol と順序なしリスト ul の詳細な説明 名前が示すように、順序付きリストは、リスト構造内のリスト項目が入っているリスト形式です。 order には、上から下に 1、2、3、または a、b、c など、さまざまな異なるシーケンス番号が存在します。 D:web ディレクトリに Web ページ ファイルを作成し、ul_ol.htm という名前を付け、コード 4.17 に示すようにコードを記述します。 コード 4.17 リスト設定: ul_ol.htm

      リスト設定

      < ;font size="5"> JavaScript & lt;/li & gt;

      & lt;/li & gt; & gt;

      & lt ;li>ASP.net

    • PHP

    • CGI

    • Ruby

    • Python

      • 「http://localhost/ul_ol」と入力します。ブラウザのアドレス バーに htm を追加した場合のブラウジング効果を図 4.18 に示します。

      図4.18 リストの設定

      以上がWeb ページの HTML 順序付きリスト ol と順序なしリスト ul の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

      関連ラベル：
      HTML 有序列表 无序列表
      ソース：php.cn
      前の記事：主流のブラウザと互換性のある使いやすい HTML ビデオ プレーヤー 次の記事：HTMLハイパーリンクの詳しい説明
      このウェブサイトの声明
      この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
      著者別の最新記事
      最新の問題
      Reactjsで複数のチェックボックスを選択する方法 複数のチェックボックスを選択したいオプションのリストがありますが、選択することができません。このコードの何が問題なのでしょうか?サンドボックスの URL
      から 2024-04-06 18:55:21
      0
      1
      396
      ナビゲーションバーの下枠のCSS ナビゲーション バーがあり、リスト内の項目にカーソルを置くと下部に赤い線を追加しましたが、その赤い線をタイトル (例: 「サービス」) の下に移動したいのですが、これを実現する方法...
      から 2024-04-06 15:04:41
      0
      2
      347
      デザインで生成されたデータベース テーブルから HTML テーブルを作成する方法 Ruby on Rails と設計については非常に初心者です。現在、データベース (MYSQL) の Student テーブルのすべてのレコードをリストする HTML ページ上のテ...
      から 2024-04-05 09:13:39
      0
      1
      2491
      LAN インストール IP を変更した後、認証サーバー「接続できません」「ホスト xxxxx は認証されていません」 ベアメタル Windows 10 インストールでは、デフォルトの Windows インストール手順を使用します。サーバーを稼働させました。繰り返しますが、これまでのところデフォルト...
      から 2024-04-04 15:06:41
      0
      1
      374
      JavaScriptを使用してプロパティを更新し、配列オブジェクトでプロパティ値を連続した順序で結果を取得する方法 オブジェクトリストの配列があり、パラメータridとrorderが渡されます。 ->1. Rid がリスト内の ID と同じ場合、itemorder> の値を rorde...
      から 2024-04-04 13:32:46
      0
      1
      382
      関連トピック
      詳細>
      人気のおすすめ
      人気のチュートリアル
      詳細>
      関連するチュートリアル
      人気のおすすめ
      最新のコース
      最新のダウンロード
      詳細>
      ウェブエフェクト
      公式サイト
      サイト素材
      フロントエンドテンプレート