Tailwind CSS Tipo de estilo de lista

Esta clase acepta mucho valor en Tailwind CSS en el que todas las propiedades están cubiertas como en forma de clase. Es la alternativa a la propiedad Tipo de estilo de lista CSS . Esta clase especifica la apariencia del marcador de elementos de la lista (como un disco, un carácter o un estilo de contador personalizado) si la ‘imagen de estilo de lista’ tiene el valor ‘ninguno’.

Clases de tipo de estilo de lista:

list-none: No se muestra ningún marcador en este modo.
list-disc: este es el valor predeterminado. El marcador es un círculo relleno.
list-decimal: un marcador es un número decimal que comienza con 1.

Sintaxis:

<element class="List Style Type">...</element>

Ejemplo:

HTML

<!DOCTYPE html> 
<head> 
    <link href=
"https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" 
          rel="stylesheet"> 
</head> 
  
<body class="text-center mx-4 space-y-2"> 
    <h1 class="text-green-600 text-5xl font-bold">
        GeeksforGeeks
    </h1> 
    <b>Tailwind CSS List Style Type Class</b> 
    <div class="mx-24 bg-green-200 text-justify px-6">
        <ul class="list-disc">
            <li>Self learning</li>
            <li>Contribute at Open Source</li>
            <li>Gain Stack overflow respect</li>
        </ul>
        <br>
        <ol class="list-decimal">
            <li>Self learning</li>
            <li>Contribute at Open Source</li>
            <li>Gain Stack overflow respect</li>        
        </ol>
        <br>
        <ul class="list-none">
            <li>Self learning</li>
            <li>Contribute at Open Source</li>
            <li>Gain Stack overflow respect</li>        
        </ul>
    </div>
</body> 
  
</html>

Producción:

Tipo de estilo de lista

Publicación traducida automáticamente

Artículo escrito por skyridetim y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

HTML

Deja una respuesta Cancelar la respuesta