Cómo inspeccionar Element en Chrome: 7 pasos (con imágenes)

Tabla de contenido:

Cómo inspeccionar Element en Chrome: 7 pasos (con imágenes)
Cómo inspeccionar Element en Chrome: 7 pasos (con imágenes)

Video: Cómo inspeccionar Element en Chrome: 7 pasos (con imágenes)

Video: Cómo inspeccionar Element en Chrome: 7 pasos (con imágenes)
Video: Cómo Colocar CABELLO a una Persona en Photoshop 2024, Mayo
Anonim

Este wikiHow te enseñará cómo inspeccionar el código fuente HTML de un elemento visual en cualquier página web en Google Chrome, usando una computadora.

Pasos

Inspeccione el elemento en Chrome Paso 1
Inspeccione el elemento en Chrome Paso 1

Paso 1. Abra Google Chrome en su computadora

El icono de Chrome parece una bola de color con un punto azul en el centro. Puede encontrarlo en la carpeta Aplicaciones en una Mac o en el menú Inicio en Windows.

Inspeccione el elemento en Chrome Paso 2
Inspeccione el elemento en Chrome Paso 2

Paso 2. Haga clic en el icono de los tres puntos verticales

Este botón se encuentra junto a la barra de direcciones en la esquina superior derecha de la ventana de su navegador. Se abrirá un menú desplegable.

Inspeccione el elemento en Chrome Paso 3
Inspeccione el elemento en Chrome Paso 3

Paso 3. Coloca el cursor sobre Más herramientas en el menú desplegable

Aparecerá un submenú.

Inspeccione el elemento en Chrome Paso 4
Inspeccione el elemento en Chrome Paso 4

Paso 4. Haga clic en Herramientas de desarrollo en el submenú Más herramientas

Esto abrirá la columna Inspector en el lado derecho de la ventana de su navegador.

Alternativamente, puede abrir el Inspector con un atajo de teclado. Este atajo es ⌥ Opción + ⌘ Cmd + I en Mac y Ctrl + Alt + I en Windows

Inspeccione el elemento en Chrome Paso 5
Inspeccione el elemento en Chrome Paso 5

Paso 5. Pase el cursor sobre un elemento de la columna Inspector

Al mover el mouse a un elemento o una línea en el Inspector, se resaltará el elemento seleccionado en la página web.

Inspeccione el elemento en Chrome Paso 6
Inspeccione el elemento en Chrome Paso 6

Paso 6. Haga clic con el botón derecho en un elemento que desee inspeccionar en cualquier página web

Su menú del botón derecho aparecerá en un cuadro desplegable.

Inspeccione el elemento en Chrome Paso 7
Inspeccione el elemento en Chrome Paso 7

Paso 7. Seleccione Inspeccionar en el menú desplegable

Esto desplazará la columna Inspector hacia arriba o hacia abajo hasta el elemento seleccionado y resaltará su código fuente.

No es necesario que abra manualmente la columna Inspector para hacer esto. Seleccionando Inspeccionar en el menú del botón derecho se abrirá automáticamente el Inspector.

Recomendado: