La vista de Diseño Adaptable hace que sea fácil ver cómo sus diseños se verán en diferentes tamaños de pantallas. Diseño Adaptable se adapta a diferentes tamaños de pantalla para proporcionar una presentacón adecuada para diferentes tipos de dispositivos, teléfonos móviles. La captura de pantalla siguiente es un ejemplo de la página web mozilla.org vista con un área de contenido 320 por 480.
La vista de Diseño Adaptable es conveniente porque se puede cambiar rápidamente el tamaño del área de contenido sin cambiar el tamaño de la ventana del navegador. Cambiar el tamaño de la ventana del navegador puede ser molesto porque todos los tamaños de tus pestañas cambian entonces y también hay menos espacio en la ventana de herramientas de desarrollo.
Tu puedes encontrar la vista de Diseño Adaptable en el menú Desarrollador Web.
Como alternativa, puede usar el atajo ctrl-shift-M en Windows o Linux y cmd-opt-M en Mac para iniciar la vista de Diseño adaptable. Presionando la tecla <esc> se cerrará la vista. Mientras que estás en la vista de Diseñó Adaptable, puedes seguir con normalidad en el área de contenido reescalado.
En la parte superior de la vista de Diseño Adaptable, hay un menú desplegable de tamaños preestablecidos que son convenientes para ver rápidamente su diseño en un número de tamaños de pantallas más comunes. También hay un botón de rotación para cambiar inmediatamente la anchura y altura (similar a la rotación de un teléfono móvil o tableta ).
Usted puede utilizar el controlador de tamaño en la parte inferior derecha del área de contenido para cambiar el tamaño del área de contenido.