Tipo de estilo de lista no Tailwind CSS
Neste artigo, exploraremos os diferentes tipos de estilo de lista Tailwind com exemplos e como usá-los em seus projetos.
Tailwind CSS fornece a capacidade de modificar o tipo de estilo de lista de listas não ordenadas e listas ordenadas usando as classes de utilitário de tipo de estilo de lista.
Ele determina o estilo do marcador usado para cada item da lista, como um marcador, número ou um símbolo personalizado.
Classes de tipo de estilo de lista Tailwind
A seguir estão os tipos de estilo de lista Tailwind disponíveis:
tipos | Visão geral |
listar-nenhum | Remove o marcador ou número dos itens da lista. |
disco de lista | Adiciona um círculo sólido como marcador aos itens da lista. |
lista decimal | Adiciona um número como marcador aos itens da lista. |
lista quadrada | Adiciona um quadrado sólido como marcador aos itens da lista. |
lista-alfa | Adiciona letras minúsculas como marcadores aos itens da lista. |
lista-romana | Adiciona algarismos romanos maiúsculos como marcadores aos itens da lista. |
lista-grego | Adiciona letras gregas minúsculas como marcadores aos itens da lista. |
lista-latim inferior | Adiciona letras latinas minúsculas como marcadores aos itens da lista. |
lista-latim-superior | Adiciona letras latinas maiúsculas como marcadores aos itens da lista. |
Sintaxe
<element class="list-decimal">...</element>
Para usar qualquer uma das classes de tipo de estilo de lista no Tailwind CSS, basta adicionar a classe apropriada à lista não ordenada ou ao elemento da lista ordenada.
O exemplo a seguir demonstra as classes de tipo de estilo de lista no Tailwind:
Example:
Example:
Conclusão
Neste artigo, discutimos os vários tipos de estilo de lista disponíveis no Tailwind CSS e como usá-los em seus projetos.