Apariencia de Tailwind CSS

Esta clase se usa para suprimir el estilo de control de formulario nativo, para restablecer cualquier estilo específico del navegador en un elemento. Esta utilidad se usa a menudo cuando se crean componentes de formulario personalizados.

Apariencia:

  • apariencia-ninguno: esta clase se utiliza para restablecer el comportamiento natural de cualquier navegador.

Sintaxis:

<element class="class="appearance-none"">...</element>

Ejemplo:

HTML

<!DOCTYPE html> 
<html> 
<head> 
    <link href= 
"https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css"
    rel="stylesheet"> 
</head> 
  
<body class="text-center"> 
    <h1 class="text-green-600 text-5xl font-bold"> 
       GeeksforGeeks 
    </h1> 
    <b>Tailwind CSS Appearance Class</b> 
    <div class="bg-green-300 
                mx-24
                p-4
                justify-between 
                grid grid-flow-col"> 
        <select>
            <option>HTML</option>
            <option>CSS</option>
            <option>JavaScript</option>
        </select>
  
        <select class="appearance-none">
            <option>Reactjs</option>
            <option>Tailwind</option>
            <option>Framer Motion</option>
        </select>
    </div> 
</body> 
</html> 

Producción:

Clase de apariencia de viento de cola

Publicación traducida automáticamente

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

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *