Aula 2

Listas

As listas HTML permitem que os desenvolvedores da Web agrupem um conjuntos de itens relacionados em listas.

Lista HTML Não Ordenada – Uma lista não ordenada começa com a tag <ul> e cada item da lista começa com a tag <li>.

<ul>
   <li>Coffee</li>
   <li>Tea</li>
   <li>Milk</li>
</ul>

Lista HTML Ordenada – Uma lista ordenada começa com a tag <ol>. Cada item da lista começa com a tag <li>.

<ol>
   <li>Coffee</li>
   <li>Tea</li>
   <li>Milk</li>
</ol>

Listas

Lista descritiva – são usadas em assuntos onde há um termo e em sequência a sua definição, estilo perguntas e respostas.

As tags usadas são:

<dl> description list – cria a lista de definição

<dt> description term – termo

<dd> description – descrição

<dl>
   <dt>HTML</dt>
      <dd>Linguagem de marcação de texto</dd>
   <dt>CSS</dt>
      <dd>Usada para formatação de documentos</dd>
</dl>

Exercício:

  1. Crie uma lista não ordenada utilizando a tag <ul> e dentro do bloco adiciona 3 itens utilizando a tag <li>. No primeiro <li> escreve “Item A”, no segundo “Item B” e no terceiro “Item C”. Verifique o resultado.
  2. Cria uma lista igual a anterior só que uma lista ordenada <ol>. Verifica o resultado.
  3. Cria uma lsita descritiva e dentro do bloco <dl> insira os blocos <dt> e <dd>. Duplique estes dois blocos de forma para ter dois termos para apresentação.
  4. No primeiro <dt> coloque “HTML” e no primeiro <dd> coloque “HTML é a abreviatura de Hypertext Markup Language, ou seja, Linguagem de Marcação Hipertexto”.
  5. Repita a operação para o segundo conjunto de <dt> e <dd> com um termo e descrição à sua escolha. Verifica o resultado.

AI Assistant