Using the console to find errors

We're just looking at the tip of the iceberg so far when it comes to what you can do with Chrome DevTools. For instance, sometimes adding an image can be tricky. So, let's add the following image tag to the page by typing it into our HTML, above h2:

<img src="images/sharkey.png" alt="sharky"> 

If we save this and refresh the site, we will see that the image just doesn't show up, so there's something wrong. Refreshing the page, a red error icon with the number one will show up in DevTools. As shown in the following screenshot, there's an error:

To see what the error is, click on the Console tab. You'll see that ...

Get Mastering CSS now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.