ホームページ  >  記事  >  ウェブフロントエンド  >  html5のリストに含まれるもの

html5のリストに含まれるもの

青灯夜游
青灯夜游オリジナル
2022-03-15 15:12:374308ブラウズ

HTML5 には 3 種類のリストがあります: 1. 「ff6d136ddc5fdfeffaf53ff6ee95f185」タグと「25edfb22a4f469ecb59f1190150159c6」タグを使用して定義された順序なしリスト; 2. 「c34106e0b4e09414b63b2ea253ff83d6」を使用して定義された順序付きリスト定義する「25edfb22a4f469ecb59f1190150159c6」タグ; 3. リストを定義し、「5c69336ffbc20d23018e48b396cdd57a」、「73de882deff7a050a357292d0a1fca94」、および「67bc4f89d416b0b8236eaa5f43dee742」タグを使用して定義します。

html5のリストに含まれるもの

このチュートリアルの動作環境: Windows 7 システム、HTML5 バージョン、Dell G3 コンピューター。

順序なしリスト

関数: 順序なしリストのセマンティクスをコンテンツの束 (順序のない全体) に追加します。リスト内の項目には順序はありません

形式:

li 英語はリスト項目であり、リスト項目として翻訳されます

<h4>选择居住城市(CN)</h4>
<ul>
  <li>北京</li>
  <li>上海</li>
  <li>广州</li>
  <li>铁岭</li>
</ul>

ul アプリケーションシナリオ:

  • ナビゲーション記事

  • 商品一覧等

  • ニュース一覧

注意事項:

  • ここでの無秩序とは、主題にコンテンツの順序がないことを意味します。たとえば、トピックは「居住都市 (CN) を選択してください」です。北京と上海はすべて中国の都市です。誰が 1 位であっても、それは中国の都市であることに変わりはありません。タイトルを「中国のスモッグランキング」に変更する場合は、厳密なランキングが必要になり、北京を最初に書かなければなりません

  • ブラウザは、順序なしリストに先頭の記号を自動的に追加しますが、ul の機能はテキストに小さなドットを追加することではなく、順序なしリストのセマンティクスを高めることであることに注意してください。 。

    • 実際には、ul には、先頭のシンボルのスタイルを変更できる type 属性もあります。値には、ディスク、正方形、円が含まれます。

    • ただしスタイルは今後CSSで完成するのでここでは紹介しません

  • ulはグループですタグは、次々に出現する必要があります。つまり、li タグは単独で存在できず、ul でラップする必要があります。

  • ul と li は全体であるため、そうではありません。他のタグを ul で囲むことをお勧めします。ul で最も重要なタグは常に覚えておいてください。li タグのみを記述するのが最善です

  • ul には li タグのみを記述することが推奨されますが、 li タグはコンテナ タグです。li タグには任意のタグを追加でき、さらに ul タグを追加することもできます

<ul>
  <li>
      好吃的
      <ul>
          <li>牛奶</li>
          <li>面包</li>
      </ul>
  </li>
  <li>
      日用的
      <ul>
          <li>毛巾</li>
          <li>牙膏</li>
      </ul>
  </li>
</ul>

順序付きリスト(順序付きリスト)

関数: 順序付きリストのセマンティクス (順序付けされた全体) を多数のコンテンツに追加すると、リスト内の項目が順序に従って配置されます。

  • #形式:

  • #
  3f7b3decd2dcafb07b84d2d3985d9f40中国房价排行0f6dfd1e3624ce5465eb402e300e01ae
  c34106e0b4e09414b63b2ea253ff83d6
      25edfb22a4f469ecb59f1190150159c6北京bed06894275b65c1ab86501b08a632eb
      25edfb22a4f469ecb59f1190150159c6上海bed06894275b65c1ab86501b08a632eb
      25edfb22a4f469ecb59f1190150159c6广州bed06894275b65c1ab86501b08a632eb
      25edfb22a4f469ecb59f1190150159c6铁岭bed06894275b65c1ab86501b08a632eb
  f6f112ef45f603be226bc581f9dd5e90

ol 応用シナリオ:

  • xxx ランキング

  • 実は ol の応用シナリオはそれほど多くありません。 ol で実行できることはすべて、ul

注:

  • ol と ul ではセマンティクスが異なるため、使い方や注意点も同じです。

  • 実は、あと 2 つの ul があります。共通属性の start 属性と type 属性は、ファイルのスタイルとシリアル番号を変更できます。先頭記号

    ##ただしスタイルは今後CSSで完成するのでここでは紹介しません
  • #定義リスト
  • #関数: 一連のコンテンツにリスト セマンティクスを追加し、dt を使用してリスト内の項目をリストし、dd

Format:


## を使用して各項目に対応する説明を追加します。 ##dt 英語の定義タイトル、定義タイトルとして翻訳されます

dd 英語の定義の説明、定義説明情報として翻訳
    #
5c69336ffbc20d23018e48b396cdd57a
  73de882deff7a050a357292d0a1fca94北京c72c1af5e0e7f90179c047c5ef85885e
  67bc4f89d416b0b8236eaa5f43dee742国家的首都, 看升国旗的地方82e295699cff932a4d4dabba39074c35
  73de882deff7a050a357292d0a1fca94上海c72c1af5e0e7f90179c047c5ef85885e
  67bc4f89d416b0b8236eaa5f43dee742魔都, 遍地是黄金的地方82e295699cff932a4d4dabba39074c35
cd324b2387ec29e44e8e788c60648872
  • dl アプリケーション シナリオ:

  • Web サイトの下部にある関連情報
  • 大量のコンテンツを見るたびに、それは何かを説明するために使用されます。コンテンツを作成するときは、次のことを行う必要があります。 dl
    • 注:
    • - dl は `グループ タグ` である必要があります。 しこりの出現は、 dt タグと dd タグは単独で存在できず、dl でラップする必要があります。

    dl、dt、dd は全体であるため、dl でラップすることはお勧めできません。その他のタグ

    dd と dt は li タグのようなコンテナ タグです。その中に任意のタグを追加できます。

      ##定義リストは非常に柔軟で、複数の dt タグを設定できます。dd , しかし、1 つの dd に複数の dt を対応させないのが最善です。dd のセマンティクスは、それに最も近い dt を記述することであるため、他の dt は記述がないことと同等であり、定義リストの意味は、各項目が次のとおりであるということです。リストされ、各エントリを説明できます
    • 定義リストは非常に柔軟で、複数の dt dd の組み合わせを複数の dl

    • 関連推奨事項: HTMLビデオチュートリアル

      >>

    以上がhtml5のリストに含まれるものの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

    声明:
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。