@Media Queries by Diego Guerra Zuñiga https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm en-us 2024-03-13 14:41:12 UTC 2024-03-13 16:07:28 UTC hello@padlet.com https://padlet.net/icons/png/1f4bb.png 1. ¿Qué es una media query? diegodanielguerra https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917431687 Una media query es una técnica en CSS que permite aplicar estilos diferentes según las características del dispositivo, como el ancho de la pantalla. Se utiliza para crear diseños responsivos en páginas web.

]]> 2024-03-13 14:52:56 UTC https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917431687 2. Sintaxis de una media query: diegodanielguerra https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917437231 Las media queries actúan como contenedor de las reglas y selectores a aplicar, por lo tanto, todo lo que engloba empieza con la apertura de una llave y termina con el cierre de la misma. En cuanto a la sintaxis, una media query siempre comienza con el indicador de @media, seguido de un mediatype.

]]> 2024-03-13 14:56:33 UTC https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917437231 3. ¿Qué significa @media en Css? diegodanielguerra https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917446167 Asocia un grupo de declaraciones anidadas, en un bloque CSS delimitado por llaves, con una condición definida por un media query.

]]> 2024-03-13 15:02:17 UTC https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917446167 4. ¿Qué es el Media Screen? diegodanielguerra https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917490975 El @media screen es una regla de CSS utilizada para aplicar estilos específicos cuando se visualiza una página en una pantalla, como en una computadora o dispositivo móvil. Permite adaptar el diseño y la apariencia de una página web según las características de la pantalla del dispositivo que se esté utilizando

]]> 2024-03-13 15:31:39 UTC https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917490975 5. ¿Cómo se usa Media Query? diegodanielguerra https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917495712 Una media query se usa en CSS para aplicar estilos específicos según características del dispositivo, como ancho de pantalla.

]]> 2024-03-13 15:34:26 UTC https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917495712 6. Como usar el @media en HTML: diegodanielguerra https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917500870 El @media en HTML se utiliza para aplicar estilos CSS específicos según características del dispositivo, como tamaño de pantalla. Se coloca dentro de una etiqueta <style> o en un archivo CSS externo.

]]> 2024-03-13 15:37:32 UTC https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917500870 7. Trucos para Responsive diegodanielguerra https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917506858

  • Usar siempre medidas en porcentaje, vw, vh.

  • Calcular bien los anchos usados cal() o margin.

  • No usar altura en las etiquetas.

    • ]]>     2024-03-13 15:41:08 UTC https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917506858     Ver más sobre Breackpoints Web Designer: diegodanielguerra https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917517886 2024-03-13 15:48:50 UTC https://padlet.com/diegodanielguerra/gkklqxa3wbvjnxgm/wish/2917517886