Tailwind CSS é uma estrutura bem conhecida que é utilizada para criar páginas ou designs da Web personalizáveis e responsivos. Ele também permite que os usuários controlem o layout e o espaçamento dos elementos sem escrever nenhum CSS personalizado. O preenchimento é o espaço entre o conteúdo do elemento específico e sua borda. Às vezes, os usuários desejam aplicar a mesma quantidade de preenchimento a todos os lados de um elemento. O Tailwind fornece classes utilitárias para aplicar preenchimento a todos os lados de um elemento ou a lados específicos, como superior, direito, inferior ou esquerdo.
Este artigo exemplificará o método para adicionar preenchimento a todos os lados de um elemento no Tailwind.
Como adicionar preenchimento a todos os lados no Tailwind?
Para adicionar preenchimento a todos os lados de um determinado elemento no Tailwind, crie uma estrutura HTML. Em seguida, use a classe de utilitário “p-
Sintaxe
< elemento aula = 'p-
Substitua o “
Exemplo
Neste exemplo, temos dois “ No segundo Saída Para adicionar preenchimento a todos os lados de um elemento no Tailwind, a classe de utilitário “p-
< corpo >
< div aula = 'bg-pink-600 p-8 w-max' >
Preenchimento em CSS do Tailwind
div >
< br >
< div aula = 'bg-teal-600 p-14 w-max' >
Preenchimento em CSS do Tailwind
div >
corpo >
Aqui, no primeiro
De acordo com a saída acima, o preenchimento especificado foi aplicado a todos os lados de ambos os contêineres. Conclusão