Herramientas de usuario

Herramientas del sitio


clase:daw:diw:css-responsivo

Diferencias

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

Enlace a la vista de comparación

clase:daw:diw:css-responsivo [2026/10/23 22:55] – Reorganización del módulo: página nueva claudeclase:daw:diw:css-responsivo [2026/10/23 23:06] (actual) – Medios movidos de 1eval/2eval a clase:daw:diw claude
Línea 8: Línea 8:
 Hacer un diseño responsivo es que la misma página se adapte a distintos tamaños de pantalla. Hacer un diseño adaptativo es hacer páginas distintas según el tamaño de la pantalla. Hacer un diseño responsivo es que la misma página se adapte a distintos tamaños de pantalla. Hacer un diseño adaptativo es hacer páginas distintas según el tamaño de la pantalla.
  
-{{:clase:daw:diw:1eval:diseno-responsivo-vs-adaptable.png?600|}}+{{:clase:daw:diw:diseno-responsivo-vs-adaptable.png?600|}}
  
 Ejemplo de diseño adaptativo es la página de AliExpress: Ejemplo de diseño adaptativo es la página de AliExpress:
Línea 228: Línea 228:
 La siguiente gráfica muestra como funciona ''clamp(200px, 59.88vw + 0.5988px, 400px)''. La siguiente gráfica muestra como funciona ''clamp(200px, 59.88vw + 0.5988px, 400px)''.
  
-{{ :clase:daw:diw:2eval:clamp.png |}}+{{ :clase:daw:diw:clamp.png |}}
  
 Para calcular los tamaños de pantalla donde se producen los cambios (puntos rojos) las variable son las siguientes: Para calcular los tamaños de pantalla donde se producen los cambios (puntos rojos) las variable son las siguientes:
Línea 245: Línea 245:
 De forma genérica podemos establecer los valores de las 4 variables de la siguiente forma: De forma genérica podemos establecer los valores de las 4 variables de la siguiente forma:
  
-{{ :clase:daw:diw:2eval:clamp_generico.png |}}+{{ :clase:daw:diw:clamp_generico.png |}}
  
 Siendo los valores de $pendiente$ y $coeficiente_{posición}$ los siguientes: Siendo los valores de $pendiente$ y $coeficiente_{posición}$ los siguientes:
Línea 280: Línea 280:
 En la primera figura  En la primera figura 
  
-{{ :clase:daw:diw:2eval:clamp.png?300 |}}+{{ :clase:daw:diw:clamp.png?300 |}}
  
 cuyos valores eran: cuyos valores eran:
Línea 588: Línea 588:
 ===== Menu responsivo ===== ===== Menu responsivo =====
  
-{{:clase:daw:diw:1eval:menu.zip|}}+{{:clase:daw:diw:menu.zip|}}
  
 <sxh html;title: HTML> <sxh html;title: HTML>
clase/daw/diw/css-responsivo.1792788945.txt.gz · Última modificación: por claude