-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
91 lines (73 loc) · 4.72 KB
/
index.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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Photo Album</title>
<link href = "./PhotoAlbum2.css" rel = "stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;500&display=swap" rel="stylesheet">
</head>
<body class = "body overlay" onload = "zoom()">
<nav>My Wolf Album</nav>
<div class = "container1">
<form class = "container">
<input type = "checkbox" id = "image1" class = "btn" name = "wolf">
<label class = "row1 row" for = "image1" name = "wolf">
<img src = "./Images/Grey Wolf 1.png" class = "centerCol1 centerRow1">
</label>
<input type = "checkbox" id = "image2" class = "btn" name = "wolf">
<label class = "row1 row" for = "image2" name = "wolf">
<img src = "./Images/Grey Wolf 2.png" class = "centerCol2 centerRow1">
</label>
<input type = "checkbox" id = "image3" class = "btn" name = "wolf">
<label class = "row1 row" for = "image3" name = "wolf">
<img src = "./Images/Grey Wolf 3.png" class = "centerCol3 centerRow1">
</label>
<input type = "checkbox" id = "image4" class = "btn" name = "wolf">
<label class = "row2 row" for = "image4" name = "wolf">
<img src = "./Images/Grey Wolf 4.png" class = "centerCol1 centerRow2">
</label>
<input type = "checkbox" id = "image5" class = "btn" name = "wolf">
<label class = "row2 row" for = "image5" name = "wolf">
<img src = "./Images/Grey Wolf 5.png" class = "centerCol2 centerRow2">
</label>
<input type = "checkbox" id = "image6" class = "btn" name = "wolf">
<label class = "row2 row" for = "image6" name = "wolf">
<img src = "./Images/Grey Wolf 6.png" class = "centerCol3 centerRow2">
</label>
<input type = "checkbox" id = "image7" class = "btn" name = "wolf">
<label class = "row3 row" for = "image7" name = "wolf">
<img src = "./Images/Grey Wolf 7.png" class = "centerCol1 centerRow3">
</label>
<input type = "checkbox" id = "image8" class = "btn" name = "wolf">
<label class = "row3 row" for = "image8" name = "wolf">
<img src = "./Images/Grey Wolf 8.png" class = "centerCol2 centerRow3">
</label>
<input type = "checkbox" id = "image9" class = "btn" name = "wolf">
<label class = "row3 row" for = "image9" name = "wolf">
<img src = "./Images/Grey Wolf 9.png" class = "centerCol3 centerRow3">
</label>
</form>
<div>
<div class = "leftSide" id = "textAlign2">
<h1>Habitat</h1>
Gray wolves were once common throughout all of North America, but were exterminated in most areas of the United States by the mid 1930s. Today, their range has been reduced to Canada, Alaska, the Great Lakes, northern Rockies and Pacific Northwest. Thanks to the reintroduction of wolves in 1995, Yellowstone National Park is one of the most favored places to see and hear wolves in their native habitat. Suitable habitat must have sufficient access to prey, protection from excessive persecution, and areas for denning and taking shelter.
</div>
<div class = "rightSide" id = "textAlign">
<h1>Gray Wolves</h1>
Gray wolves range in color from grizzled gray or black to all-white. As the ancestor of the domestic dog, the gray wolf resembles German shepherds or malamutes. Though they once nearly disappeared from the lower 48 states, today wolves have returned to the Great Lakes, northern Rockies and Southwestern United States.
<br>
Wolves play a key role in keeping ecosystems healthy. They help keep deer and elk populations in check, which can benefit many other plant and animal species.
<br>
The center image is from the Colorado Wolf And Wildlife Center
<br><br>
<div>Visit:</div>
<a href = "https://www.wolfeducation.org/" target = "_blank"> Colorado Wolf And Wildlife Center</a>
</div>
</div>
</div>
</body>
</html>