-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
310 lines (301 loc) · 14.8 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
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<link rel="stylesheet" href="design.css">
<title>Encyclopedia UI design</title>
</head>
<body>
<div class="container">
<nav class="topbar">
<div class="brand">
<div class="left-brand">
<div class="logo">
<img alt="Encyclopedia icon" src="images/Encyclopedia_icon.svg.png">
</div>
<a href="#">Encyclopedia</a>
</div>
<form class="search">
<input class="form-control" type=" text ">
<button>Search</button>
</form>
</div>
<ul class="category">
<li>Earth and Environment</li>
<li>History</li>
<li>Literature and the Arts</li>
<li>Medicine</li>
<li>People</li>
<li>Philosophy and Religion</li>
<li>Places</li>
<li class="catagory-selected">Plants and Animals</li>
<li>Science and Technology</li>
<li>Social Sciences and the Law</li>
<li>Sports and Everyday Life</li>
<li>Additional References</li>
</ul>
<ul class="breadcrumb">
<li>
<a href="#">Home</a>
</li>
<li>
<a href="#">Plants and Animals</a>
</li>
<li>
<a href="#" class="last">Animals</a>
</li>
</li>
</ul>
</nav>
<main class="main">
<h3>Sub Categories</h3>
<ul class="sub-category">
<li>Amphibians</li>
<li>Crustaceans</li>
<li>Domesticated Animals</li>
<li>Invertebrates</li>
<li>Birds</li>
<li>Dinosaurs</li>
<li>Fish</li>
<li>Mollusks</li>
<li>Cats</li>
<li>Dogs</li>
<li>Insects</li>
<li>Mammals</li>
</ul>
<div class="sort">
<h3>Sort</h3>
<button>Popular</button>
<button>A</button>
<button>B</button>
<button>C</button>
<button>D</button>
<button>D</button>
<button>E</button>
<button>F</button>
<button>G</button>
<button>H</button>
<button>I</button>
<button>J</button>
<button>K</button>
<button>L</button>
<button>M</button>
<button>N</button>
<button>O</button>
<button>P</button>
<button>Q</button>
<button>R</button>
<button>S</button>
<button>T</button>
<button>U</button>
<button>V</button>
<button>W</button>
<button>X</button>
<button>Y</button>
<button>Z</button>
</div>
<ul class="items">
<li>
<div class="image">
<img src="images/rabbit.jpg" alt="rabbit">
</div>
<div class="text">
<b>Rabbit</b>
any of 29 species of long-eared mammals belonging to the family Leporidae, excluding hares (genus Lepus). Frequently the
terms rabbit and hare are used interchangeably, a practice that can cause confusion. Jackrabbits,
for instance, are actually hares, whereas the rockhares and the hispid…
</div>
</li>
<li>
<div class="image">
<img src="images/Peacock.jpg" alt="Peacock">
</div>
<div class="text">
<b>Peacock</b>
any of three species of resplendent birds of the pheasant family, Phasianidae (order Galliformes). Strictly, the male is
a peacock, and the female is a peahen; both are peafowl. The two most-recognizable species of peafowl
are the blue, or Indian, peacock (Pavo cristatus), of India and Sri…
</div>
</li>
<li>
<div class="image">
<img src="images/reindeer.jpg" alt="reindeer">
</div>
<div class="text">
<b>Reindeer</b>
(Rangifer tarandus), species of deer (family Cervidae) found in the Arctic tundra and adjacent boreal forests of Greenland,
Scandinavia, Russia, Alaska, and Canada. Reindeer have been domesticated in Europe. There are two
varieties, or ecotypes: tundra reindeer and forest (or woodland)…
</div>
</li>
<li>
<div class="image">
<img src="images/chicken.jpg" alt="chicken">
</div>
<div class="text">
<b>Chicken</b>
Chicken, (Gallus gallus), any of more than 60 breeds of medium-sized poultry that are primarily descended from the wild red
jungle fowl (Gallus gallus, family Phasianidae, order Galliformes) of India. The chicken is perhaps
the most widely domesticated fowl, raised worldwide for its meat and eggs.…
</div>
</li>
<li>
<div class="image">
<img src="images/lion.jpg" alt="lion">
</div>
<div class="text">
<b>Lion</b> (Panthera leo), large, powerfully built cat (family Felidae) that is second in size only
to the tiger. The proverbial “king of beasts,” the lion has been one of the best-known wild animals
since earliest times.</div>
</li>
<li>
<div class="image">
<img src="images/dog.jpg" alt="dog">
</div>
<div class="text">
<b>Dog</b> (Canis lupus familiaris), domestic mammal of the family Canidae (order Carnivora). It is
a subspecies of the gray wolf (Canis lupus) and is related to foxes and jackals. The dog is one of
the two most ubiquitous and most popular domestic animals in the world (the cat is the other). For
more…
</div>
</li>
<li>
<div class="image">
<img src="images/giant_panda.jpg" alt="giant_panda">
</div>
<div class="text">
<b>Giant panda</b> (Ailuropoda melanoleuca) feeding in a bamboo forest, Sichuan (Szechwan) province,
China. Giant panda Giant panda, (Ailuropoda melanoleuca), bearlike mammal inhabiting bamboo forests
in the mountains of central China. Its striking coat of black and white, combined with a bulky body
and round face, gives it a captivating appearance that has endeared it to people worldwide. According
to the IUCN Red…
</div>
</li>
<li>
<div class="image">
<img src="images/dianosaur.jpg" alt="dianosaur">
</div>
<div class="text">
<b>Dinosaur</b> the common name given to a group of reptiles, often very large, that first appeared
roughly 245 million years ago (near the beginning of the Middle Triassic Epoch) and thrived worldwide
for nearly 180 million years. Most died out by the end of the Cretaceous Period, about 66 million
years…
</div>
</li>
<li>
<div class="image">
<img src="images/Labrador_retriever.jpg" alt="Labrador_retriever">
</div>
<div class="text">
<b>Labrador retriever</b> breed of sporting dog that originated in Newfoundland and was brought to England
by fishermen about 1800. It is an outstanding gun dog, consistently dominating field trials. Standing
21.5 to 24.5 inches (55 to 62 cm) and weighing 55 to 80 pounds (25 to 36 kg), it is more solidly…
</div>
</li>
<li>
<div class="image">
<img src="images/Elephant.jpg" alt="Elephant">
</div>
<div class="text">
<b>Elephant</b>
(family Elephantidae), largest living land animal, characterized by its long trunk (elongated upper lip and nose), columnar
legs, and huge head with temporal glands and wide, flat ears. Elephants are grayish to brown in colour,
and their body hair is sparse and coarse. They are found most…
</div>
</li>
<li>
<div class="image">
<img src="images/hummingbrid.jpg" alt="hummingbrid">
</div>
<div class="text">
<b>Hummingbird</b> any of about 320 species of small, often brightly coloured birds of the family Trochilidae,
usually placed with the swifts in the order Apodiformes but sometimes separated in their own order,
Trochiliformes. The brilliant, glittering colours and elaborately specialized feathers of many…
</div>
</li>
<li>
<div class="image">
<img src="images/polar_bear.jpg" alt="polar_bear">
</div>
<div class="text">
<b>Polar bear</b>
(Ursus maritimus), great white northern bear (family Ursidae) found throughout the Arctic region. The polar bear travels
long distances over vast desolate expanses, generally on drifting oceanic ice floes, searching for
seals, its primary prey. Except for one subspecies of grizzly bear,…
</div>
</li>
<li>
<div class="image">
<img src="images/horse.jpg" alt="horse">
</div>
<div class="text">
<b>Horse</b>
(Equus caballus), a hoofed, herbivorous mammal of the family Equidae. It comprises a single species, Equus caballus, whose
numerous varieties are called breeds. Before the advent of mechanized vehicles, the horse was widely
used as a draft animal, and riding on horseback was one of the chief…
</div>
</li>
<li>
<div class="image">
<img src="images/bird.jpg" alt="bird">
</div>
<div class="text">
<b>Bird</b>
(class Aves), any of the more than 10,400 living species unique in having feathers, the major characteristic that distinguishes
them from all other animals. A more-elaborate definition would note that they are warm-blooded vertebrates
more related to reptiles than to mammals and that they…
</div>
</li>
<li>
<div class="image">
<img src="images/chetah.jpg" alt="chetah">
</div>
<div class="text">
<b>Cheetah</b>
(Acinonyx jubatus), one of the world’s most-recognizable cats, known especially for its speed. Cheetahs’ sprints have been
measured at a maximum of 114 km (71 miles) per hour, and they routinely reach velocities of 80–100
km per hour while pursuing prey. Nearly all the cheetahs remaining…
</div>
</li>
<li>
<div class="image">
<img src="images/flamingo.jpg" alt="flamingo">
</div>
<div class="text">
<b>Flamingo</b>
(order Phoenicopteriformes), any of six species of tall, pink wading birds with thick downturned bills. Flamingos have slender
legs, long, graceful necks, large wings, and short tails. They range from about 90 to 150 cm (3 to
5 feet) tall. Flamingos are highly gregarious birds. Flocks…
</div>
</li>
<li>
<div class="image">
<img src="images/tilapia.jpg" alt="flamingo">
</div>
<div class="text">
<b>Tilapia</b>
common name used for certain species of fishes belonging to the family Cichlidae (order Perciformes), represented by numerous,
mostly freshwater species native to Africa. Tilapias are perhaps best known because of their potential
as an easily raised and harvested food fish. Their…
</div>
</li>
<li>
<div class="image">
<img src="images/goldfish.jpg" alt="goldfish">
</div>
<div class="text">
<b>Goldfish</b>
(Carassius auratus), ornamental aquarium and pond fish of the carp family (Cyprinidae) native to East Asia but introduced
into many other areas. The goldfish resembles the carp (Cyprinus carpio) but differs from its relative
in having no mouth barbels. It was domesticated by the Chinese…
</div>
</li>
</ul>
</main>
<div class="footer">
Image Credits: BRITANICA
</div>
</div>
</body>
</html>