Create a Nested List in HTML 5

Create a Nested List in HTML 5

We can use a nested list to add a list with a list to your web page. A nested list enables you to display listed text at a different level within the list hierarchy, such as when you are displaying products arranged in categories and sub-categories. Web Browser uses indentation to show here a list of items that exist in the hierarchy. We can use both numbered and bulleted lists within an existing list.

Create a Nested List

Step 1: Click where you want to insert a list or add a new line within the existing list and type <ol> for a numbered list or ul for an unordered list.

Note: To Create a numbered list see the section ” Create a Numbered List.” To Create a bulleted list see the section ” Create a Bulleted list.”

Step 2:Type the new list text, Including the <li> and </li> tags, using the same technique you used to create the original list.

Step 3: Type </ol> or</ul> at the end of the nested list.

Result Output

<!DOCTYPE html>
<html>
    <Head>
        <Title>Coding thai</Title>
    </Head>
    <body>
        Type of Web Developer 
        <hr>
       <ul>
        <li>Fontend Developer</li>
            <ul>
                <li>HTML</li>
                <li>CSS </li>
                <li>Javascript</li>
            </ul>
        <li>Backend Developer</li>
            <ul>
                <li>PHP</li>
                <li>Django</li>
            </ul>
       </ul>
        <hr>
       <small>Copyright 2022 Codingthai</small>
    </body>
</html>

Follow us on Social Media For More

FacebookInstagramPinterest