-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
166 lines (144 loc) · 5.38 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
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<img src='https://sharp-villani-e65ba8.netlify.app/zoo.svg'
alt="zoo logo"
id="logo"
>
<nav>
<ul>
<li>Directions</li>
<li>Food & Drink</li>
<li>Education</li>
<li>Your Visit</li>
</ul>
</nav>
</header>
<main>
<section class="introduction">
<h1>Birmingham Zoo</h1>
<p>
The zoo is open every day of the year and features three major biomes:
the Tropic Zone, Temperate Territory, and the Polar Circle. From tropical birds,
to snow leopards, grizzly bears, and one of the nation’s largest
colonies of Antarctic penguins, there are animals to enjoy in every season.
</p>
</section>
<div id="badge">
<p>Opening 2021!</p>
</div>
<section class="bears">
<h2>Bears</h2>
<p>Did you know that a bear's closest relative is the seal? Or that bears can smell over 2,000 times better than humans?</p>
<div class="image-container">
<img id="bear1"
src="https://placebear.com/200/300"
alt="Grizzly Bear"
width="200"
height="300"
>
<img id="bear2" src="https://placebear.com/400/300"
alt="Grizzly Bear"
width="400"
height="300"
>
<img id="bear3"src="https://placebear.com/200/400"
alt="Grizzly Bear"
width="200"
height="301"
>
</div>
</section>
<section class="tigers">
<h2 id="tiger-h2">Tiger Facts</h2>
<ul id="ul-tiger">
<li>Tigers are the largest cat species in the world reaching up to 3.3 meters in length and weighing up to 670 pounds!
<li>Tigers are easily recognizable with their dark vertical stripes and reddish/orange fur.
<li>The Bengal tiger is the most common tiger.
<li>Tigers live between 20-26 years in the wild.
<li>Unlike most other cats, tigers are great swimmers and actually like the water.
</ul>
</section>
<section class="giraffe">
<h2 class="giraffe-title">Giraffe</h2>
<p id="first-p">Giraffes are the world's tallest mammals, thanks to their towering legs and long necks. A giraffe's legs alone are taller than many humans—about 6 feet . These long legs allow giraffes to run as fast as 35 miles an hour over short distances and cruise comfortably at 10 miles an hour over longer distances.</p>
<h3 class="giraffe-title">Behavior</h3>
<p>Typically, these fascinating animals roam the open grasslands in small groups of about half a dozen.</p>
<p>Bulls sometimes battle one another by butting their long necks and heads. Such contests aren't usually dangerous and end when one animal submits and walks away.</p>
<h3 class="giraffe-title">Height and Size</h3>
<p>Giraffes use their height to good advantage and browse on leaves and buds in treetops that few other animals can reach (acacias are a favorite). Even the giraffe's tongue is long! The 21-inch tongue helps them pluck tasty morsels from branches. Giraffes eat most of the time and, like cows, regurgitate food and chew it as cud. A giraffe eats hundreds of pounds of leaves each week and must travel miles to find enough food.</p>
</section>
<section id="penguin">
<h2>Penguins</h2>
<p>
<strong>
Pinguins are a group of aquatic flightless birds. They live almost exclusively in the
southern hemisphere: only one species, the Galápagos penguin, is found
north of the Equator. Highly adapted for life in the water, penguins have countershaded
dark and white plumage and flippers for swimming.
</strong>
</p>
<div>
<img id="penguin-image" src="images.css/baby-penguins.jpg" alt="A lot of Pinguins">
</div>
</section>
<section class="news">
<h2>News</h2>
<div class="card">
<time>2010-04-16</time>
<h4>Helping wild turtles in Seychelles</h4>
<a>Find out More</a>
</div>
<div class="card">
<time>2010-04-12</time>
<h4>Learning about the rainforest</h4>
<a>Find out More</a>
</div>
<div class="card">
<time>2010-04-18</time>
<h4>Wich big cat are you?</h4>
<a>Find out More</a>
</div>
</section>
<section class="education">
<div class="education-container">
<h3>Learning resources for schools</h3>
<p>Explore our activities, videos, and lesson plans to support a wide range of curriculum topics</p>
<button>Find them here</button>
</div>
</section>
<section class="membership">
<h2>Are there any benefits or discounts for members?</h2>
<p id="membership-p">There are <strong>AMAZING</strong> benefits of becoming a member with Birmingham Zoo! Our members get special discounts in our shops, cafes, and unlimited entry</p>
<button>Learn More</button>
</section>
<section class="programs">
<h2>Programs</h2>
<div class="card">
<h4>Children and Family Programs</h4>
<a>Find out More</a>
</div>
<div class="card">
<h4>Adult Programs</h4>
<a>Find out More</a>
</div>
<div class="card">
<h4>Youth and young adults</h4>
<a>Find out More</a>
</div>
<br>
<h3>Useful Links</h3>
<a href="https://www.w3schools.com" target="_blank">w3schools.com</a>
<a href="https://www.nationalgeographic.com/" target="_blank">National Geographic</a>
<a href="http://www.wikipedia.org" target="_blank">Wikipedia</a>
</section>
</main>
<footer>
<p>Open Monday-Friday 7am-4pm</p><address>1 Birmingham Road</address>
</footer>
</body>
</html>