Day 4, let's build something really simple with the HTML tags we have learned. You should also try this out in your VS code.
View the code below:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Bugs Bunny</title>
<!--<link rel="stylesheet" href="style.css"> -->
</head>
<body>
<main>
<h1>BUGS</h1>
<section>
<h2>Mr. Bugs Bunny</h2>
<!-- This is how to comment-->
<p>See more <a target="_blank" href="https://www.alamy.com/stock-photo/bugs-bunny.html?sortBy=relevant">bugs bunny photos</a> in our gallery.</p>
<a href="https://en.wikipedia.org/wiki/Bugs_Bunny">
<figure>
<img style="border:6px dashed #FF69B4;" src="https://i.postimg.cc/wjPPRpdf/4352030-bugs.jpg" alt="An image of Bugs Bunny" border="10" border-color{ pink }; height:"200px", width:"200px">
</a>
<figcaption>Fig.1 Image of Bugs Bunny.</figcaption>
</figure>
</section>
</body>
</html>
Here is the output:
Now it is your turn to try it out. I used an image hosted online. If you are working locally, you should download the image into a folder and then link it. :)