-
-
Notifications
You must be signed in to change notification settings - Fork 242
/
Copy pathexample.html
87 lines (87 loc) · 3.76 KB
/
example.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
<!DOCTYPE html>
<html lang="en">
<head>
<title>I love owls</title>
</head>
<body>
<header>
<img src="images/logo.png" alt="codebar.io">
<h1>Owls...</h1>
<p>They're a hoot!</p>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="#facts">Facts</a></li>
<li><a href="#links">Links</a></li>
</ul>
</nav>
</header>
<main>
<h2>Did you know?</h2>
<p>Owls are birds from the order Strigiformes, which includes about 200 species of mostly solitary and nocturnal birds of prey typified by an upright stance, a large, broad head, binocular vision, binaural hearing, sharp talons, and feathers adapted for silent flight. Exceptions include the diurnal northern hawk-owl and the gregarious burrowing owl.</p>
<img src="images/img1.jpg" alt="an owl chick with big eyes"/>
<img src="images/img2.jpg" alt="a small owl with it's eyes closed being stroked on the head"/>
<img src="images/img3.jpg" alt="a small owl on a branch"/>
<h2>My favourite owl species</h2>
<ol>
<li>Snowy owl</li>
<li>Barn owl</li>
<li>Tawny owl</li>
</ol>
<a href="https://www.youtube.com/watch?v=gBjnfgnwXic">Watch this video here</a>
<h2>A Poem</h2>
<p>A wise old owl sat on an oak;<br>
The more he saw the less he spoke;<br>
The less he spoke the more he heard;<br>
Why aren't we like that wise old bird?
</p>
<section id="facts">
<h2>Owl Facts!</h2>
<article>
<h3>Teeny Tiny!</h3>
<p>The Elf Owl is the world's smallest owl. They are about 5-6 inches tall. <i>Awwwwwww!</i></p>
<figure>
<img src="https://upload.wikimedia.org/wikipedia/commons/d/d3/Elf_owl_puffed.jpg" alt="Elf Owl">
<figcaption>An Elf Owl</figcaption>
</figure>
<a href="https://en.wikipedia.org/wiki/Elf_owl" title="Elf Owls on Wikipedia">Read more about Elf Owls</a>
</article>
<article>
<h3>I spy</h3>
<p>The Northern Hawk Owl can spot a vole up to <em>half a mile</em> away.</p>
<figure>
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/0/0e/Northern_Hawk_Owl%2C_Cheshire_Game_and_Country_Fair_2014_1.jpg/400px-Northern_Hawk_Owl%2C_Cheshire_Game_and_Country_Fair_2014_1.jpg" alt="Northern Hawk Owl">
<figcaption>A Northern Hawk Owl</figcaption>
</figure>
<a href="https://en.wikipedia.org/wiki/Northern_hawk-owl" title="Northern Hawk Owl on Wikipedia">Read more about Northern Hawk Owls</a>
</article>
<article>
<h3>Well I didn't vote for him!</h3>
<p>A group of owls is called a <b>parliament</b>. This originates from C.S. Lewis’ description of a meeting of owls in The Chronicles of Narnia.</p>
<figure>
<img src="images/parliament.jpg" alt="A frowning owl">
<figcaption>A stern looking owl</figcaption>
</figure>
<a href="http://lenichoir.org/2013/04/a-murder-of-crows-a-parliament-of-owls/" title="Le Nichoir - Canada's wild birds">Read more about naming groups of brids</a>
</article>
</section>
</main>
<aside id="links">
<h2>Useful Links</h2>
<ul>
<li>
<a href="mailto:[email protected]?subject=I love owls :: codebar">Email us</a>
</li>
<li>
<a href="mailto:?subject=I love owls :: codebar">Email a friend</a>
</li>
<li>
<a href="https://twitter.com/codebar">Tweet us about Owls on Twitter</a>
</li>
</ul>
</aside>
<footer>
<p>This website made by <a href="www.example.com" title="me on twitter">me</a>!</p>
</footer>
</body>
</html>