A√ļn no tienes acceso a esta clase

Crea una cuenta y contin√ļa viendo este curso

Curso de Tailwind CSS 2020

Curso de Tailwind CSS 2020

Víctor Yoalli Domínguez

Víctor Yoalli Domínguez

Display

11/29
Recursos

Aportes 10

Preguntas 0

Ordenar por:

¬ŅQuieres ver m√°s aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesi√≥n.

<h3>Display</h3>

Las propiedades de display son √ļtiles para poder controlar las dimensiones o espacios. Las propiedades b√°sicas de display son:

  • Block ‚Üí Con esta configuraci√≥n los bloques abarcan toda la pantalla.

    <div class="text-center">
    		<div class="block bg-blue-800">1</div>
        <div class="block bg-blue-500">2</div>
        <div class="block bg-blue-300">3</div>
    </div>
    
  • Inline-block ‚Üí S√≥lo ocupan el espacio necesario para mostrar lo que hay en su interior.

    <div class="text-center">
    		<div class="inline-block bg-blue-800">1</div>
        <div class="inline-block bg-blue-500">2</div>
        <div class="inline-block bg-blue-300">3</div>
    </div>
    
  • Inline ‚Üí S√≥lo ocupan el espacio necesario para mostrar lo que hay en su interior y la altura del elemento es indiferente.

    <div class="text-center">
    		<div class="inline bg-blue-800">1</div>
        <div class="inline bg-blue-500">2</div>
        <div class="inline bg-blue-300">3</div>
    </div>
    
  • Hidden ‚Üí El elemento en cuesti√≥n no se muestra.

    <div>
        <div class="inline-block bg-blue-800">1</div>
        <div class="inline-block bg-blue-500">2</div>
        <div class="hidden bg-blue-300">3</div>
        <div class="inline-block bg-blue-100">4</div>
    </div>
    

Propiedades para controlar dimensiones y espacios de las cajas de presentación (display) :

  • Block: abarca toda la pantalla
  • Inline-Block: ocupan el espacio necesario
  • Inline: ocupan el espacio necesario sin altura
  • Hidden: el bloque no se muestra

Tailwind, es compatible para usar en Wordpress? Obviando que, utilizamos ‚Äúphp‚ÄĚ.

¬ŅQue atajo de teclado usa el profesor para crear archivos y rutas asi como se estilaba en sublime text?

La documentación de Display la encuentran el siguiente link:
https://tailwindcss.com/docs/display

Caja de Presentación

‚ÄúEstas propiedades pueden controlar las dimensiones o espacios.‚ÄĚ

-Block - en la caja de presentación no cambia con block.
-Inlilne-block - se posiciona dentro de la caja.
-Inline - se posiciona fuera de la caja.
-Hideden - se oculta el elemento.

Les recomiendo mucho que lean la documentación, hay modificaciones muy interesantes allí además si quieren ver algunos ejemplos de páginas construidas y elementos agregados también se muestran allí.

Bueno para recordar.

¬ŅNo hay dispay grid?

Display inline es que viene por defecto