logongas

Herramientas de usuario

Herramientas del sitio

Ocultar Menú
Traza:
clase:daw:diw:1eval:tema06

Diferencias

Muestra las diferencias entre dos versiones de la página.

Enlace a la vista de comparación

Ambos lados, revisión anteriorRevisión previa
Próxima revisión		Revisión previa
clase:daw:diw:1eval:tema06 [2025/11/07 12:26] – Lorenzoclase:daw:diw:1eval:tema06 [2025/11/07 12:28] (actual) – Lorenzo
Línea 6: Línea 6:
 Flex se utiliza para colocar cosas de forma horizontal o vertical. Flex se utiliza para colocar cosas de forma horizontal o vertical.
  
-  * [[https://css-tricks.com/snippets/css/a-guide-to-flexbox/|A Complete Guide to Flexbox]]  + 
-  * {{css_flexbox_layout_cheatsheet.pdf|Flexbox Layout Cheatsheet. Otra gía rápida de flexbox}} +  * [[https://css-tricks.com/snippets/css/a-guide-to-flexbox/|A Complete Guide to Flexbox]]  
-  * [[https://medium.com/@js_tut/the-complete-css-flex-box-tutorial-d17971950bdc|The Complete CSS Flex Box Tutorial]] +  * {{css_flexbox_layout_cheatsheet.pdf|Flexbox Layout Cheatsheet. Otra gía rápida de flexbox}} 
-  * [[https://medium.com/@js_tut/flexbox-the-animated-tutorial-8075cbe4c1b2|Flexbox — The Animated Tutorial]] +  * [[https://medium.com/@js_tut/the-complete-css-flex-box-tutorial-d17971950bdc|The Complete CSS Flex Box Tutorial]] 
-  * [[https://stackoverflow.com/questions/32551291/in-css-flexbox-why-are-there-no-justify-items-and-justify-self-properties|In CSS Flexbox, why are there no “justify-items” and “justify-self” properties?]] +  * [[https://medium.com/@js_tut/flexbox-the-animated-tutorial-8075cbe4c1b2|Flexbox — The Animated Tutorial]] 
-  * [[https://flexboxfroggy.com/#es|Flexbox Froggy - A game for learning CSS flexbox]]+  * [[https://stackoverflow.com/questions/32551291/in-css-flexbox-why-are-there-no-justify-items-and-justify-self-properties|In CSS Flexbox, why are there no “justify-items” and “justify-self” properties?]] 
 +  * [[https://flexboxfroggy.com/#es|Flexbox Froggy - A game for learning CSS flexbox]]. 
  
 Vamos a explicar flex con el siguiente ejemplo: Vamos a explicar flex con el siguiente ejemplo:
Línea 18: Línea 20:
   <div class="l-flex__area">Item1</div>   <div class="l-flex__area">Item1</div>
   <div class="l-flex__area">Item2</div>   <div class="l-flex__area">Item2</div>
-  <div class="l-flex__area l-flex__area--grow2">Item3</div>+  <div class="l-flex__area l-flex__area--grow-2">Item3</div>
   <div class="l-flex__area">Item4</div>   <div class="l-flex__area">Item4</div>
   <div class="l-flex__area">Item5</div>   <div class="l-flex__area">Item5</div>
clase/daw/diw/1eval/tema06.1762514803.txt.gz · Última modificación: por Lorenzo