-
Notifications
You must be signed in to change notification settings - Fork 0
/
03-abrir_las_herramientas_de_desarrollo_de_chrome.html
42 lines (37 loc) · 1.63 KB
/
03-abrir_las_herramientas_de_desarrollo_de_chrome.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>3. Abrir las herramientas de desarrollo de Chrome</title>
</head>
<body>
<h1>Capítulo 3</h1>
<h2>Abrir las herramientas de desarrollo de Chrome</h2>
<section>
<h3>Input ChatGPT</h3>
<p>¿Cómo puedo abrir las herramientas de desarrollo en Chrome y encontrar las pestañas de consola y fuentes?</p>
</section>
<section>
<h3>Para qué sirve</h3>
<p>Abrir las herramientas de desarrollo en Chrome es una habilidad esencial para los desarrolladores web. Permite
inspeccionar y modificar el HTML, CSS y JavaScript de una página, así como depurar errores y analizar el
rendimiento del sitio. Saber cómo abrir estas herramientas y navegar entre sus pestañas es fundamental para
optimizar y depurar aplicaciones web.</p>
</section>
<script>
console.log('3. Abrir las herramientas de desarrollo de Chrome')
/**
* Ejercicio 1: Practica abrir las herramientas de desarrollo en Chrome usando el atajo de teclado Ctrl + Shift + I.
* Nota: Esto se debe hacer manualmente y no a través de un script.
*/
/**
* Ejercicio 2: Aprende a enfocar directamente la pestaña de consola con el atajo Ctrl + Shift + J.
* Nota: Este atajo también debe ser practicado manualmente.
*/
/**
* Ejercicio 3: Navega a la pestaña de fuentes utilizando el mouse o las teclas de dirección para familiarizarte con la exploración de archivos de código fuente.
* Nota: Explora diferentes archivos en la pestaña de fuentes para entender cómo se organiza el código de la página.
*/
</script>
</body>
</html>