Tailwind CSS es un marco CSS de bajo nivel altamente personalizable que le brinda todos los componentes básicos que necesita. Las utilidades Tailwind CSS Spacing administran y controlan los elementos de relleno, el margen del elemento y el espacio entre los elementos secundarios.
El siguiente ejemplo le dará una breve idea sobre el espaciado de Tailwind CSS:
Ejemplo:
HTML
<!DOCTYPE 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 Space Between Class</b> <div class="mx-4 space-y-4"> <div class="bg-green-400 h-16 rounded-lg border-2 border-green-800">1</div> <div class="bg-green-400 h-16 rounded-lg border-2 border-green-800">2</div> <div class="bg-green-400 h-16 rounded-lg border-2 border-green-800">3</div> <div class="bg-green-400 h-16 rounded-lg border-2 border-green-800">4</div> </div> </body> </html>
Producción:
Publicación traducida automáticamente
Artículo escrito por GeeksforGeeks-1 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA