<!DOCTYPE html>
<html>
<head>
<style>
img {
width: 400px;
height: 300px;
}
</style>
</head>
<body>
<h1>Parks to Visit</h1>
<a href="https://en.wikipedia.org/wiki/Yosemite_National_Park">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a4/Yosemite_NP_-_Tunnel_View_looking_at_El_Capitan_-_Pano_%282017%29.jpg/2446px-Yosemite_NP_-_Tunnel_View_looking_at_El_Capitan_-_Pano_%282017%29.jpg" alt="Yosemite National Park"></a>
<a href="https://en.wikipedia.org/wiki/Banff_National_Park">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/bb/Banff_-_View_from_Sulphur_Mountain_IMG_2211_resize.jpg/2880px-Banff_-_View_from_Sulphur_Mountain_IMG_2211_resize.jpg" alt="Banff National Park"></a>
<a href="https://en.wikipedia.org/wiki/Zion_National_Park">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/2/2e/Zion_angels_landing_view1.jpeg/1200px-Zion_angels_landing_view1.jpeg" alt="Zion National Park"></a>
<a href="https://en.wikipedia.org/wiki/Tre_Cime_di_Lavaredo">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/8f/Tre_Cime_di_Lavaredo_2009.JPG/800px-Tre_Cime_di_Lavaredo_2009.JPG" alt="Tre Cime di Lavaredo"></a>
<a href="https://en.wikipedia.org/wiki/Plitvice_Lakes_National_Park">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/8d/Slapovi_Korane%2C_Plitvice_%282%29.jpg/1707px-Slapovi_Korane%2C_Plitvice_%282%29.jpg" alt="Plitvice Lakes National Park"></a>
</body>
</html>
In the last exercise, we made one image link to another page.
Now we’ll extend that a bit to have 5 images link to external pages.
Take five national parks you have heard of or visited, find photos of the park, and then link the pictures to the Wikipedia page for the park. You should have a header that says “Parks to Visit”
BONUS CHALLENGE:
Resize all of the park images so that they are the same size
1 answer
8 answers