Info
Contenido

Puntos de interrupción CSS

Cuando se utilizan diseños predeterminados, el sistema aplicará diferentes puntos de interrupción al cambiar entre móvil, tableta y computadora de escritorio. Los puntos de interrupción son:

Minimo

  • Tamaño de pantalla inferior a 321 px de ancho o 321 px de alto
  • El tamaño de fuente se ajusta a 0.38
  • La altura de la línea se ajusta a 1.05 em.
  • El relleno del cuadro se reduce a 5px.
  • Tamaño de pantalla inferior a 450x450: El tamaño del cuadro cambia al 100%100%

Móvil: retrato

  • Tamaño de pantalla inferior a 480 px de ancho y 926 px de alto
  • El ancho del cuadro se expandió al 100 % y la altura mínima fue de 300 px.
  • Los botones se colocan debajo del contenido.
  • El logotipo está oculto.
  • El acolchado se reduce
  • Adicional: si el tamaño de la pantalla es inferior a 414x736 o 736x414 (por ejemplo, iPhone 6/7/8), el relleno de la caja se reduce

Móvil: Paisaje

  • Tamaño de pantalla inferior a 926 px de ancho y 480 px de alto
  • El ancho del cuadro se expandió al 100 % y la altura mínima fue de 150 px.
  • Los botones se colocan en el lado derecho del contenido con un ancho de 250 px.
  • El logotipo está oculto.
  • El acolchado se reduce
  • Adicional: si el tamaño de la pantalla es inferior a 414x736 o 736x414 (por ejemplo, iPhone 6/7/8), el relleno de la caja se reduce

Escritorio y tableta

  • Tamaño de pantalla superior a 926x480 o 480x926

Consultas de medios adicionales

Capas posicionadas como "inferior/ancho completo", "superior/ancho completo" y "Empujar hacia abajo":

  • Ancho máximo 1500 px: el contenido (título, texto y propósitos) de la capa de consentimiento se reducirá a "100% - 450 px" para mostrar los botones en el lado derecho del contenido.
  • Ancho máximo 1200 px: el contenido (título, texto y propósitos) de la capa de consentimiento se reducirá a "100% - 250 px" para mostrar los botones en el lado derecho del contenido. Este
  • Ancho máximo 800 px: el contenido (título, texto y propósitos) de la capa de consentimiento se ampliará al 100 % para mostrar los botones debajo del contenido.

Capas posicionadas como "abajo/derecha", "abajo/centro", "medio/centro" y "arriba/centro":

  • Ancho máximo 600 px: el tamaño del cuadro cambia al 100 % del ancho.

Capas posicionadas como "medio/centro":

  • Altura máxima 600 px y ancho mínimo 926 px: el tamaño del cuadro cambia a su altura completa y el contenido se configura para flexionarse con desbordamiento automático para evitar que el cuadro sea demasiado alto para la ventana.

Capas posicionadas como "derecha/altura completa" e "izquierda/altura completa":

  • Ancho máximo 400 px: el tamaño del cuadro cambia al 100 % del ancho.

Página de configuración personalizada:

  • Ancho máximo 570 px: la navegación se mueve hacia la parte superior para dar suficiente espacio al contenido.

 

Volver