2012-04-19 15 views
8

Estoy seguro de que esto se encuentra en algún lugar del inspector de herramientas del desarrollador, pero no puedo encontrarlo. ¿Dónde encontraría, para un elemento dado (digamos, un div), las dimensiones calculadas (alto y ancho) de un elemento dado en el que hago clic derecho y selecciono "Inspeccionar elemento"?¿Cómo encontrar el tamaño calculado de cualquier elemento en Herramientas para desarrolladores de Chrome?

+0

'Inspeccionar elemento', observe el panel derecho, haga clic en 'estilos computados' en el panel superior. O usa el panel 'métricas'. Pero esta no es una pregunta de programación, creo. –

Respuesta

14

Simplemente pase el puntero sobre el nombre del elemento en la cinta debajo del panel de herramientas del desarrollador. El elemento correspondiente se resaltará en la ventana del navegador y las dimensiones aparecerán en una esquina del mismo. Además, si se desplaza hacia abajo en el panel derecho de las herramientas de desarrollador, verá la ventana 'Métricas' que le dará las dimensiones calculadas y también los márgenes, bordes, bordes, etc.

Aquí hay una captura de pantalla del dimensiones del div que contiene tu pregunta SO. Observe las dimensiones en la esquina inferior izquierda de la región resaltada mientras sobrevuelo el nombre div en la parte inferior. A la derecha está la ventana de Métricas.

Computed Size Screenshot

Click here for bigger image

Para preguntas futuras, sólo se refiere a Google de nice documentation primero.

+2

+1 gran respuesta. Gracias por la captura de pantalla! –

+1

El enlace de la documentación de Google ahora está roto. La página ahora se puede encontrar en https://developer.chrome.com/devtools – OscillatingEthmoid

+3

En la versión "46.0.2490.86 m", no hay "Estilos calculados" y la ventana Métricas dice 100% x 100%. :( – LGT

Cuestiones relacionadas