Tictac Soluciones Informáticas > Diseño web > Depurar la versión para imprimir de una web con el inspector de elementos

Depurar la versión para imprimir de una web con el inspector de elementos

Los desarrolladores web estamos acostumbrados a utilizar el inspector de elementos del navegador para depurar nuestro código y, así, resolver problemas de diseño, identificando los elementos y modificando dinámicamente sus estilos.

Estábamos creando la versión imprimible de una web, cuando nos encontramos con el problema de que queríamos depurar la regla css @media print y no sabíamos acceder a esta versión imprimible en el navegador para utilizar el inspector de elementos.

Aquí os dejamos las instrucciones para hacerlo.

Si utilizas Firefox

– Paso 1: Pulsa las teclas Shift + F2. Se abrirá la barra de herramientas para desarrolladores en la parte inferior del navegador
– Paso 2: Escribe ahí: media emulate print. Aparecerá en el navegador la versión imprimible y podrás utilizar el inspector de elementos como siempre.

Si utilizas Chrome

– Paso 1: Tendrás que abrir como siempre las herramientas para desarrolladores ( CTRL + F12 ó CTRL + SHIFT + I) o a través de las opciones del navegador (Más herramientas > Herramientas para desarrolladores).
– Paso 2: En la esquina superior derecha de las herramientas para desarrolladores, deberás hacer clic sobre el botón con los 3 puntos verticales, hacer clic sobre “More Tools” o “Más herramientas” y luego hacer clic sobre “Rendering”.

– Paso 2: Se abrirá una nueva ventana en la parte inferior de las herramientas para desarrolladores y, ahí, deberemos seleccionar la opción de “Emulate media” y elegir, de la lista desplegable, la opción de “print”.
Así, podremos utilizar el inspector de elementos y depurar el css de la versión imprimible en el navegador Chrome.
2018-08-27T10:07:28+00:0002/08/2017|Diseño web|

Deje su comentario

Centro de preferencias de privacidad

Estrictamente necesarias

Cookies necesarias para el correcto funcionamiento de nuestra web. Por ejemplo, necesitamos que unas cookies estrictamente necesarias estén habilitadas con el objetivo de guardar tus preferencias sobre el uso de cookies. Si deshabilitas esta cookie, no podremos guardar tus preferencias. Esto quiere decir que cada vez que visites nuestra web, tendrás que volver a habilitar o deshabilitar las cookies otra vez.

wordpress_test_cookie, Wp-settings-time-1, wp-settings-1, gdpr, 1P_JAR

AdvertisingEstadísticas y análisis

Cookies de análisis de terceros. Estas cookies son generadas por Google Analytics. Google almacena la informacion recogida por las cookies en servidores ubicados en Estados Unidos, cumpliendo con la legislación Europea en cuanto a protección de datos personales y se compromete a no compartirla con terceros, excepto cuando la ley le obligue a ello o sea necesario para el funcionamiento del sistema. Google no asocia su direccion IP con ninguna otra información que tenga.

_ga, _gid, _gat

Analytics

Other