-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathlearn.html
More file actions
168 lines (143 loc) · 7.13 KB
/
learn.html
File metadata and controls
168 lines (143 loc) · 7.13 KB
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
<!DOCTYPE html>
<html>
<head>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5266488193186724"
crossorigin="anonymous"></script>
<meta charset="utf-8">
<script src="learn.js" async></script>
<link rel="stylesheet" href="indexStyle.css">
<link rel="Shortcut Icon" type="image/x-icon" href="img/home.ico" />
<link href="https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@600&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Rock+Salt&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@600&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Bodoni+Moda:wght@500&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Mr+De+Haviland&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Rosario:wght@600&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Alice&display=swap" rel="stylesheet">
<title>InfoSec Learning</title>
<style>
footer{
display: block;
clear:both;
bottom: 0;
padding:5px;
text-align:center;
font-family: 'Noto Serif TC', serif;
}
p{
font-family: 'Noto Serif TC', serif;
font-size: 130%;
}
body{
margin-right:2em;
margin-left:2em;
}
</style>
</head>
<body style="background-color: #BCB8B1;" >
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5266488193186724"
crossorigin="anonymous"></script>
<!-- wwP -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-5266488193186724"
data-ad-slot="8898229275"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<br><br>
<header>
<div class="navbar">
<a href="index.html"><img src="img/logo.png" class="logo"></a>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="learn.html">Learning</a></li>
<li><a href="game.html">InfoSec Game</a></li>
<li><a href="html/about.html">About</a></li>
</ul>
</nav>
</div>
</header>
<h1 class="title">Information Security Knowledge</h1>
<div id="top" class="navbar">
<nav>
<ul style="text-align: right;">
<li class="title-a" style="width: 10%; text-align: center;">Navbar</li><br><br><br>
<li><a href="learn.html#P1">Plain text and Cipher text</a></li><br><br>
<li><a href="learn_2.html#P2">Cryptography</a></li><br><br>
<li><a href="learn_3.html#P3">This is password.</a></li><br><br>
<li><a href="learn_4.html#P4">Buffer Overflow</a></li><br><br>
<li><a href="learn_5.html#P5">Cross-Site Scripting</a></li><br><br>
<li><a href="learn_6.html#P6">Forensics</a></li><br><br>
</ul>
</nav>
</div>
<h1 id="P1" class="title-f">Plain text and Cipher text</h1> <a href="#top"><img src="img/caret-quare-up.png" alt=""></a>
<div class="container">
<div class="box" style="width: 55%;">
<h1 class = "title-a">明文<br>Plain text</h1><br>
<p style="text-align: left;">
<br>
  不論在軟體抑或網頁開發，多少都會碰到機密資料的處理。此時，未受加密的原始資料稱為明文<span style="font-style: oblique">(Plain Text)。</span><br><br>
  資料處理的過程若不加密，而直接傳送處理的話是十分危險的，容易遭攻擊者取得機密資料，進而竄改或進行其他攻擊。
</p>
</div>
</div>
<div class="container">
<div class="box" style="width: 55%;">
<h1 class = "title-a">密文<br>Cipher text</h1><br>
<p style="text-align: left;">
<br>
  傳遞過程經過加密程序的文本稱為密文(Cipher Text)。<br><br>
  經過加密算法產生金鑰(Key)，又分為對稱(A Public Key)與非對稱金鑰(A Public Key & A Private Key)之差別。<br><br>
  下面為簡易加密模擬，使用⊕(xor)的可逆特性：
</p>
</div>
</div>
<div class="container">
<div class="box">
<p style="align-content: center; margin-bottom: 3%;margin-top: 3%;">
<div class="box">
<p>
<br>
<p style="background-color: #999999;width: 50%;margin-left: 25%;">
<span style="color: white;margin-top: 3%; font-size: 150%;font-weight: 700;">Simulation</span><br>
<span style="color: white;">Plain text:</span>
<input type="text" id="cipher_input"><br>
<span style="color: white;"> Plain text ⊕ KEY = Cipher text</span><br>
<span style="color: white;">
<span id="plainShow">Plain text</span>
⊕ <span style="color: white;text-align: left;" id="key">KEY</span> =
<span id="cipherShow">Cipher text</span>
</span>
<br>
<span style="color: white;">Cipher text:</span>
<input type="text" style="color: red;" id="cipher_output" disabled="disabled"><br><br>
<button style="margin-left: 36%;font-size: 120%;" class="button" onclick="cipher();">Encryption</button>
</p>
</p>
</div>
<img class="img-rot13" src="img/xor.png" alt="" width="40%" >
</p>
</div>
</div>
<p style="text-align: right">
返回top <a href="#top"><img src="img/caret-quare-up.png" alt=""></a>
</p>
<br><br><br>
<footer>
<p><small>
<font size="5" face="serif">Takeda <br><a rel="license" href="http://creativecommons.org/licenses/by-nc/3.0/tw/"><img alt="創用 CC 授權條款" style="border-width:0" src="https://i.creativecommons.org/l/by-nc/3.0/tw/88x31.png" /><a href=""></a><br>2021</font>
</small></p>
<font size="10">
<span style="font-family: 'Mr De Haviland', cursive;">Takeda NaNa</span>
</font>
</footer>
</body>
</html>