Sep 1, 2026

Introduction: List Tag

 1. Unordered List (Bullet Points)

<ul>

  <li>HTML5 Syntax</li>

  <li>CSS Styling</li>

  <li>JavaScript Interactivity</li>

</ul>


2. Ordered List (Numbered Steps) 

<ol>

  <li>Open your text editor</li>

  <li>Write your HTML markup</li>

  <li>Save the file with a .html extension</li>

</ol>


3. Nested List (Sub-items inside a parent list item)

<ul>

  <li>Frontend Development

    <ul>

      <li>HTML</li>

      <li>CSS</li>

      <li>JavaScript</li>

    </ul>

  </li>

  <li>Backend Development

    <ul>

      <li>Node.js</li>

      <li>Python</li>

    </ul>

  </li>

</ul>

Direct Children Rule: An <ol> or <ul> can only contain <li> elements as direct children. You cannot put headings, paragraphs, or secondary lists directly inside a <ul> or <ol>.

Nesting Rule: To nest a list correctly, place the inner <ul> or <ol> inside an individual <li> tag, before that <li> is closed.

Correct: <li>Parent <ul><li>Child</li></ul> </li>

Incorrect: <li>Parent</li> <ul><li>Child</li></ul>


Description List 

<dl>

  <dt>Term</dt>

  <dd>Description or definition</dd>

</

dl>

​<dl> (Description List) — Main container element.

​<dt> (Description Term) — The key, term, or question (bold by default).

​<dd> (Description Details) — The value, definition, or answer (indented by default).


No comments:

Post a Comment

Thank you to visit Bapi's Page.