¿Cómo abrir herramientas de desarrollador en Chrome? (con imagenes)

¿Está buscando herramientas para desarrolladores en el navegador Chrome? Bueno, las herramientas de desarrollo (DevTools) son el conjunto de herramientas que lo ayudan a inspeccionar HTML, CSS y JavaScript cargados actualmente y que lo ayudan a conocer el interior del navegador Chrome y su aplicación web.

Las herramientas de desarrollo se utilizan generalmente para realizar un seguimiento del diseño de la página web. Las herramientas de desarrollo también le permiten inspeccionar los estilos utilizados en la página web, el tamaño de las imágenes en la página web e incluso el script de la página web.

Con la ayuda de las herramientas de desarrollo, puede cambiar los estilos de la página web para ver qué efecto muestran en el sitio web, lo que le da acceso al funcionamiento interno del navegador web.

En esta sección, analizaremos algunos métodos para abrir DevTools en Chrome.

Pasos para abrir herramientas de desarrollador en Chrome

Método 1 de 3 Uso del menú de Chrome

Paso 1: Abra su navegador Chrome y haga clic en menú icono indicado por tres puntos verticales, como puede ver en la imagen de abajo. En el menú que se muestra, debe hacer clic en ‘Otras herramientas‘opción.

Paso 2: La opción «Más herramientas» le llevará al «Herramientas de desarrollo‘opción.

Abrir herramientas de desarrollo en Chrome-03

Al hacer clic en la opción «Herramientas para desarrolladores», la interfaz de usuario de las herramientas para desarrolladores aparecerá a la derecha, a la izquierda o en la parte inferior de la ventana de Chrome. Este panel de herramientas para desarrolladores le permitirá acceder a diferentes partes de la interfaz de usuario de DevTools.

Abrir herramientas de desarrollo en Chrome-04

Método 2 de 3 Uso de la opción Inspeccionar

Paso 1: Abra su navegador web, vaya al sitio web cuyo diseño o secuencia de comandos desea rastrear y ahora haga clic derecho en la página del sitio web. Ahora, desde la opción que se muestra, haga clic en ‘Inspeccionar’ opción.

Abrir herramientas de desarrollo en Chrome-01

Esto mostrará la interfaz de usuario de DevTools en la propia ventana de Chrome.

Abrir herramientas de desarrollo en Chrome-04

Método 3 de 3 Uso de teclas de acceso rápido

Abra la ventana de Chrome y acceda al sitio web que desea inspeccionar. Ahora presiona Ctrl + Mayús + I.

Abrir herramientas de desarrollo en Chrome-06

La interfaz de usuario de las herramientas de desarrollo aparecerá en la ventana de Chrome.

Abrir herramientas de desarrollo en Chrome-04

Entonces, estos son los tres métodos mediante los cuales puede obtener las herramientas de desarrollo para su navegador web Chrome.