-
Notifications
You must be signed in to change notification settings - Fork 0
/
spiderman.html
119 lines (113 loc) · 5.85 KB
/
spiderman.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
<!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>Spider-Man</title>
<link href="styles/style.css" rel="stylesheet">
<link rel="icon" type="image/svg+xml" href="images/favicon.svg">
</head>
<body class="page2">
<div id="progressbar"></div>
<div id="scrollPath"></div>
<header>
<nav>
<ul>
<li><button aria-hidden="true"><img src="https://assets.codepen.io/274456/ui-icon-hamburger.svg" alt="" /></button></li>
<ul>
<li><a href="./index.html"> Home</a></li>
<li><a href="#"> Comics</a></li>
<li><a href="#"> Movies</a></li>
<li><a class="active"> Characters</a></li>
<li><a href="#"> Games</a></li>
<li><a href="#"> Video's</a></li>
<li><button aria-hidden="true">Dark/light mode</button></li>
<li><button aria-hidden="true">Spidey Theme</button></li>
</ul>
<li> <img src="./images/Marvel_Logo.png" alt=""></li>
<li> <a href="./spiderman.html"><img src="./images/search-icon.png" alt=""></a></li>
</ul>
</nav>
</header>
<main>
<section>
<div>
<img src="./images/spidey-ffh.jpeg" alt="">
<h1>Peter Parker</h1>
<p>Bitten by a radioactive spider, Peter Parker’s arachnid abilities give him amazing powers he uses to help others, while his personal life continues to offer plenty of obstacles.</p>
</div>
</section>
<section>
<img src="./images/spiderman-ps4.jpeg" alt="">
<h2>Spider-Man</h2>
<p>With amazing spider-like abilities, teenage science whiz Peter Parker fights crime and dreams of becoming an Avenger as Spider-Man.</p>
</section>
<h3>Story Moments</h3>
<section>
<article>
<img src="./images/spidey-civil-war.webp" alt="">
<p>Teaming up </p> <p> In Berlin, Spider-Man found himself fighting alongside Iron Man and several other Super Heroes against a rogue Captain America and his allies.</p>
</article>
<article>
<img src="./images/spidey-ferry.jpeg" alt="">
<p> Staten Island Ferry </p> <p>Encountering a villain called the Vulture, Spider-Man tried to save the Staten Island Ferry from sinking, but needed Iron Man’s help to save everyone on board.</p>
</article>
<article>
<img src="./images/homemade-spidey.webp" alt="">
<p>Taking on Vulture </p> <p> With Tony Stark taking back his high tech suit, Peter used his original homemade costume to take on the Vulture. Who he found out was the dad of his prom date...</p>
</article>
<article>
<img src="./images/ironspidey.webp" alt="">
<p>New Suit </p> <p> While attempting to save Doctor Strange, Peter was given a new, advanced suit by Tony that better protected him as he found himself traveling to space.</p>
</article>
<article>
<img src="./images/spideyvsthanos.jpeg" alt="">
<p>Battling Thanos </p> <p> On Titan, Spider-Man joined forces with several other heroes against Thanos, attempting to remove the Infinity Gauntlet from his hand with the help of his new Suit. </p>
</article>
</section>
<h4>Powers+Abilities</h4>
<section>
<article>
<img src="./images/spidey-agility.jpeg" alt="">
<p>Agility </p> <p> Spider-Man has incredible agility, allowing him to catch his enemies off guard with how quickly he can move and contort in battle. He also uses this to dodge bullets in fights </p>
</article>
<article>
<img src="./images/spidey-sense.jpeg" alt="">
<p>Awareness </p> <p> Spider-Man has shown an extrasensory awareness of impending danger. Wich he uses to evade bullets or to detect danger is his nearby surroundings</p>
</article>
<article>
<img src="./images/spidey-webshooters.jpeg" alt="">
<p>Web-Shooters </p> <p> Peter Parker’s own invention, which were then upgraded by Tony Stark, Spider-Man’s web-shooters can be used as weapons, a means to travel the city, and much more. </p>
</article>
<article>
<img src="./images/spidey-legs.png" alt="">
<p>Pincers </p> <p> Even more advanced than the first costume Tony Stark gave him, Peter’s armored suit includes pincers that can be used to help root Spider-Man in place. </p>
</article>
</section>
</main>
<footer>
<img src="./images/Marvel_Logo.png" alt="">
<section>
<ul>
<li><a href="http://">ABOUT MARVEL</a></li>
<li><a href="http://">HELP/FAQS</a></li>
<li><a href="http://">CAREERS</a></li>
<li><a href="http://">INTERNSHIPS</a></li>
</ul>
<ul>
<li><a href="http://">ADVERTISING</a></li>
<li><a href="http://">DISNEY+</a></li>
<li><a href="http://">MARVELHQ.COM</a></li>
<li><a href="http://">REDEEM DIGITAL COMICS</a></li>
</ul>
</section>
<ul>
<li><a href="https://twitter.com/marvel?lang=nl"><img src="./images/twitter_logo.png" alt=""></a></li>
<li><a href="https://www.instagram.com/marvel/"><img src="./images/insta_logo.png" alt=""></a></li>
<li><a href="https://nl-nl.facebook.com/Marvel/"><img src="./images/facebook.png" alt=""></a></li>
</ul>
</footer>
<script defer src="scripts/script.js"></script>
</body>
</html>