HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTMLリスト

HTMLドキュメントには、順序付けされていないという3種類のリストがあります。 リスト、注文済み リストと説明 リスト。

順序付けられていないHTMLリスト

これは、各リスト項目が

  • タグで囲まれている
      タグを使用して定義されます。

      構文

      以下は構文です-

      <ul>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<ul>

      注文されたHTMLリスト

      これは、各リスト項目が

    • タグで囲まれている
        タグを使用して定義されます。

        構文

        以下は構文です-

        <ol>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<ol>

        説明HTMLリスト

        これは、

        タグを使用して定義されます。ここで、各定義用語は
        タグで囲まれ、各説明は
        タグで囲まれます。

        構文

        以下は構文です-

        <dl>
<dt>define term</dt>
<dd>describe term</dd>
<dt>define term</dt>
<dd>describe term</dd>
<dl>

        HTMLリストの例を見てみましょう：

        例

        <!DOCTYPE html>
<html>
<style>
   body {
      color: #000;
      height: 100vh;
      background-color: #8BC6EC;
      background-image: linear-gradient(135deg, #8BC6EC 0%, #9599E2 100%);
   }
</style>
<body>
<h1>HTML Lists Demo</h1>
<h3>Unordered List</h3>
<ul>
<li>Physics Subject</li>
<li>Chemistry Subject</li>
<li>Economics Subject</li>
</ul>
<h3>Ordered List</h3>
<ul>
<li>Physics Book Part 1</li>
<li>Physics Book Part 2</li>
<li>Physics Book Part 3</li>
</ul>
<h3>Description List</h3>
<dl>
<dt>Physics Book</dt>
<dd>- It covers modern physics and quantum physics</dd>
<dt>Chemistry Book</dt>
<dd>- It covers organic, inorganic and physical chemistry</dd>
</dl>
</body>
</html>

        出力

        HTMLリスト


    1. HTMLDOMスタイルlistStylePositionプロパティ

      HTML DOMスタイルのlistStylePositionプロパティは、リストアイテムマーカーの位置を設定または返すために使用されます。 以下は、-の構文です。 listStylePositionプロパティの設定- object.style.listStylePosition = "outside|inside|initial|inherit" 上記の特性は次のように説明されます- 値 説明 外部 これはデフォルト値であり、テキストの前にリストアイテムマーカーを配置します。 内部 これにより、リストアイテムマーカーが少し内側にイン

    2. HTMLDOMOlオブジェクト

      HTMLのHTMLDOMOlオブジェクトは、要素を表します。 要素の作成 var olObject = document.createElement(“OL”) ここで、「olObject」は次のプロパティを持つことができます- プロパティ 説明 反転 リストの順序を降順にするか昇順にするかを設定/返します（デフォルト） 開始 順序付きリストの開始属性の値を設定/返します タイプ 順序付きリストのtype属性の値を設定/返します オールスタートの例を見てみましょう プロパティ- 例 <!DOCTYPE