Crie um novo arquivo chamado “listas.html”: 
<html>
<head>
	<title>Listas no HTML</title>
</head>

<body>
	<h1>Listas no HTML</h1>
</body>
</html>
No HTML temos dois tipos de listas. As listas ordenadas são aquelas em que os itens são pontuados por numeração. Para criar uma lista ordenada usamos a tag <ol> e a tag <li>: 
<html>
<head>
	<title>Listas no HTML</title>
</head>

<body>
	<h1>Listas no HTML</h1>

	<p>Lista ordenada de melhores filmes segundo o IMDB:</p>
	<ol>
		<li>Um Sonho de Liberdade</li>
		<li>O Poderoso Chefão</li>
		<li>Batman: O Cavaleiro das Trevas</li>
		<li>O Poderoso Chefão II</li>
		<li>12 Homens e uma Sentença</li>
	</ol>
</body>
</html>
Já as listas não ordenadas são aquelas que não são numeradas e por padrão utilizam uma bolinha. Para criá-las usamos as tags <ul> e <li>: 
<html>
<head>
	<title>Listas no HTML</title>
</head>

<body>
	<h1>Listas no HTML</h1>

	<p>Lista ordenada de melhores filmes segundo o IMDB:</p>
	<ol>
		<li>Um Sonho de Liberdade</li>
		<li>O Poderoso Chefão</li>
		<li>Batman: O Cavaleiro das Trevas</li>
		<li>O Poderoso Chefão II</li>
		<li>12 Homens e uma Sentença</li>
	</ol>

	<p>Lista não ordenada de filmes de animação:</p>
	<ul>
		<li>Super Mario Bros</li>
		<li>Homem Aranha no Aranhaverso</li>
		<li>Divertidamente</li>
		<li>Coraline e o Mundo Secreto</li>
		<li>Planeta do Tesouro</li>
	</ul>
</body>
</html>
Os elementos de listas podem ser usados dentro de outras listas e eles se tornam aninhadas automaticamente com uma leve margem à esquerda: 
<html>
<head>
    <title>Aninhamento de listas</title>
</head>

<body>

...


    <h2>Bolos</h2>
    <ol>
        <li>
            <strong>Bolos Tradicionais</strong>
            <ol>
                <li>Bolo de Chocolate Fofinho</li>
                <li>Bolo de Cenoura com Cobertura de Chocolate</li>
                <li>Bolo de Limão com Glacê de Limão</li>
            </ol>
        </li>
        <li>
            <strong>Bolos de Festas</strong>
            <ol>
                <li>Bolo de Aniversário com Recheio de Frutas</li>
                <li>Bolo de Casamento com Flores de Açúcar</li>
                <li>Bolo de Natal com Frutas Cristalizadas</li>
            </ol>
        </li>
    </ol>

    <h2>Sobremesas</h2>
    <ul>
        <li>
            <strong>Sobremesas Geladas</strong>
            <ul>
                <li>Sorvete de Chocolate Caseiro</li>
                <li>Pudim de Leite Condensado</li>
                <li>Gelatina Colorida com Creme</li>
            </ul>
        </li>
        <li>
            <strong>Sobremesas Especiais</strong>
            <ul>
                <li>Mousse de Maracujá com Calda de Chocolate</li>
                <li>Cheesecake de Morango</li>
                <li>Pavê de Chocolate com Biscoitos</li>
            </ul>
        </li>
    </ul>
</body>
</html>