HTML 목록 표시

Olá pessoal, hoje vamos conhecer como utilizar listas e suas variadas formas.

Lista não ordenada




<ul>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
</ul>




리스타 오르데나다




<ol>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
</ol>




Lista ordenada, iniciando a partir do numero 6:

<ol start="6">
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
</ol>




Lista ordenada invertida, iniciando a partir do numero 15:

<ol reversed start="15">
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
</ol>




Lista ordenada utilizando ordem alfabética e em caixa baixa:

<ol type="a">
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
</ol>




Lista ordenada utilizando ordem alfabética e em caixa alta:

<ol type="A">
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
</ol>




Lista ordenada utilizando sistema numérico romano e em caixa baixa:

<ol type="i">
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
</ol>




Lista ordenada utilizando sistema numérico romano e em caixa alta:

<ol type="I">
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
</ol>




Lista dentro de outra lista:



Podemos utilizar listas dentro de outra lista, independente se é ordenada ou não.

<ul>
  <li>item</li>
  <ol>
    <li>item</li>
    <li>item</li>
    <li>item</li>
    <li>item</li>
    <li>item</li>
  </ol>
  <li>item</li>
  <li>item</li>
  <li>item</li>
</ul>




정의 목록




<dl>
  <dt>Café</dt>
  <dd>Bebida quente</dd>
  <dt>Cerveja</dt>
  <dd>Bebida Alcoólica</dd>
</dl>




Pronto pessoal, conhecemos as listas em HTML, valeu 😎✌!

좋은 웹페이지 즐겨찾기