Neste artigo, mostrarei como criar títulos e listas em HTML, usando as tags h1 -> h6 e ul – li .

Ao apresentar um artigo em Word, colocaremos o título 1 no título principal desse artigo. Em seguida é colocar o cabeçalho 2 para itens grandes, dentro de cada item grande colocaremos os cabeçalhos 3. E em HTML também, usaremos tags de cabeçalho (abreviadas como h ) para apresentar na web.

Em seguida, também apresento a tag ul e a tag li , são dois pares de tags que geralmente se juntam para criar itens de lista. Vamos, vamos começar.

Criar títulos em HTML

A tag h ( título ) é usada para criar o título principal e os subtítulos de uma página da web, não apenas tem o efeito de enfatizar os títulos, mas também funciona no campo do SEO do site.

Temos um total de 6 tags h, de h1 -> h6 e o ​​tamanho da fonte padrão de cada tag diminuirá gradativamente. H1 terá o maior tamanho, seguido por h2 .. e finalmente h6.

 <h1>Tiêu đề H1</h1> <h2>Tiêu đề H2</h2> <h3>Tiêu đề H3</h3> <h4>Tiêu đề H4</h4> <h5>Tiêu đề H5</h5> <h6>Tiêu đề H6</h6>

Para você entender melhor, veja como eu apresentei neste artigo da seguinte forma:

• No título principal do artigo coloquei a tag h1 " tags HTML para formatos de cabeçalho e lista "
• Os dois subtítulos " tag de formatação de cabeçalho " e " tag de formatação de lista " usam a tag h2 porque é uma pequena parte do h1
• Da mesma forma, se em cada tag h2 , se for mais dividida, usaremos a tag h3 .

Criar listas em HTML

Se o título for usado para criar o título principal e o subtítulo dos itens, a tag de lista será usada para listar os dados. Esta apresentação é bastante comum ao trabalhar com o Word.

Exemplo : Suponha que eu tenha 3 itens, agora vou listá-los da seguinte forma.

• item 1
• item2
• item3

Para criar a estrutura acima, devemos combinar as tags ul e li . Onde a tag ul é usada para declarar uma lista de itens e a tag li é usada para declarar cada item.

Com o exemplo acima, sua estrutura HTML ficará assim:

 <ul> <li>item1</li> <li>item2</li> <li>item3</li> </ul>

Caso você queira ter um sub-item, ou seja, cada item terá uma lista de sub-itens, basta criar uma tag ul dentro desse item.

Por exemplo : Item2 terá itens filhos adicionais da seguinte forma.

• item 1
• item2
  • item 2.1
  • item 2.2
• item3

Agora a estrutura HTML ficará assim:

 <ul> <li>item1</li> <li>item2 <ul> <li>​item2.1</li> <li>item2.2</li> </ul> </li> <li>item3</li> </ul>

Se você quiser criar uma lista marcada com números como este:

1. Item 1
2. Item2
3. Item 3

Em seguida, use a tag ol em conjunto com a tag li da seguinte forma:

 <ol> <li>item1</li> <li>item2</li> <li>item3</li> </ol>

Exercícios feitos por você para criar títulos e listas em HTML

O tópico é o seguinte : Escreva um artigo usando HTML e CSS, usando tags de título para criar títulos e subseções. Dentro de cada item, use as tags ul e li para criar uma lista.

Normalmente usamos as tags ul e li para construir menus de vários níveis, menus verticais e menus horizontais. No entanto, para fazer isso, você deve combinar com CSS. Então, depois de aprender as duas partes de HTML e CSS, vamos fazer esses exemplos práticos.