-
Notifications
You must be signed in to change notification settings - Fork 0
/
klein_rm.html
103 lines (101 loc) · 6.46 KB
/
klein_rm.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="https://e1.pngegg.com/pngimages/10/563/png-clipart-sword-art-online-version-2-anime-folder-icon-b-sword-art-online-001-sword-art-online-thumbnail.png" type="image/x-icon">
<link rel="stylesheet" href="style2.css">
<title>SAO</title>
</head>
<body style='overflow-x:hidden;'>
<script>
// Scroll to specific values
// scrollTo is the same
window.scroll({
top: 2500,
left: 0,
behavior: 'smooth'
});
// Scroll certain amounts from current position
window.scrollBy({
top: 100, // could be negative value
left: 0,
behavior: 'smooth'
});
// Scroll to a certain element
document.querySelector('.hello').scrollIntoView({
behavior: 'smooth'
});
</script>
<header>
<img src="https://cdn.worldvectorlogo.com/logos/sword-art-online.svg" alt="logo" width="200" draggable="false">
<nav id="menu1">
<ul>
<li><a href="index.html" class="nav__link">Home</a></li>
<li><a href="index4.html" class="nav__link">About Me</a></li>
<li>
<a class="nav__link">Blog</a>
<ul>
<li><a href="kirito_rm.html" class="nav__link">Kirito (Kirigaya Kazuto)</a></li>
<li><a href="asuna_rm.html" class="nav__link">Asuna (Yuuki Asuna)</a></li>
<li><a href="yui_rm.html" class="nav__link">Yui (Yui-MHCP001)</a></li>
<li><a href="klein_rm.html" class="nav__link">Klein</a></li>
</li>
</ul>
<li><a href="mailto:[email protected]" class="nav__link">Contact</a></li>
</ul>
</nav>
</header>
<main>
<div class="post">
<img alt="Sword Art Online" class="n3VNCb" src="https://i.pinimg.com/originals/99/44/8b/99448b4abce3cfef5f77a3b1c09c10d0.jpg" style="width: 320px; height: 514px; margin: 0px; position: relative; left: -10px;" draggable="false">
<div>
<h3 style="@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;1,400;1,900&display=swap'); font-family: 'Roboto', sans-serif;">Klein</h3>
<p>
Tsuboi Ryoutarou (壷井遼太郎, Tsuboi Ryōtarō), known as Klein (クライン, Kurain) in «Sword Art Online» (SAO), «ALfheim Online» (ALO) and «Project Alicization», is a supporting character in the Aincrad Arc and a reoccurring character through the Sword Art Online series. He was one of the 10,000 players who were trapped in Sword Art Online, where he was the guild leader of «Fuurinkazan», one of the clearer guilds. After Sword Art Online was cleared, he began playing ALfheim Online as a Salamander.
</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/rd15auBieMg" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>
<div class="post">
<img alt="Sword Art Online" class="n3VNCb" src="https://i.pinimg.com/originals/ef/dc/b5/efdcb5a889a2defaa0961aa88dc92ee0.jpg" style="width: 320px; height: 514px; margin: 0px; position: relative; left: -10px;" draggable="false">
<div>
<h3 style="@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;1,400;1,900&display=swap'); font-family: 'Roboto', sans-serif;">Real Life / Sword Art Online Avatar</h3>
<p>
In both Sword Art Online and the real world, Klein wore a red bandana that held up his hair and was tied around his forehead. In Sword Art Online, he had spiky reddish hair, but he has brownish hair in the real world. He also had a hooked nose, a slight beard on his cheeks and chin, and, according to Kirito, he looked like a wandering samurai or a bandit. During the two years in Aincrad he used red robes and black armor resembling those of a samurai including a katana, along with his guild members.
</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/mb-vNLANvjQ" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div>
</div>
<div class="post">
<img alt="Sword Art Online" class="n3VNCb" src="https://www.clipartkey.com/mpngs/m/252-2525603_sword-art-online-klein-sword.png" style="width: 420px; height: 514px; margin: 0px; position: relative; left: -10px;" draggable="false">
<div>
<h3 style="@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;1,400;1,900&display=swap'); font-family: 'Roboto', sans-serif;">ALfheim Online Avatar</h3>
<p>
In ALfheim Online, Klein's appearance is mostly the same as his appearance in Sword Art Online, except that his hair is dyed red in ALfheim Online.
</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/mb-vNLANvjQ" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div>
</div>
</main>
<footer>
<div>
<div><img src="https://www.pngkey.com/png/full/165-1657786_sword-art-online-rpg-fsword-art-online-logo.png" draggable="false" alt="Logo" width="250"></div>
<div class="footer-columns">
<div class="footer-column">
<h3>About</h3>
<p>Hi, my name is Kirito. And I create a website about my favorite anime Sword Art Online.
In this site I'll post some information about SAO and its characters.</p>
</div>
<div class="footer-column">
<h3>Contact me</h3>
<p>You can contact me and ask your questions by mail.
<br><strong>Email: <a>[email protected]</a></strong>
</p>
</div>
</div>
<center>
<small>Copyright © 2020 Kirito's Blog</small>
</center>
</div>
</footer>
</body>
</html>