-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
267 lines (223 loc) · 8.14 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
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>NY B6 SECTION C</TITLE>
<meta charset="utf-8">
<meta name="author" content="batch 6 stuents">
<meta name="descrrption" content="this is website presents the top universities in Cambodia">
<meta name="keywords" content="best universities in Cambodia, top universitiesin Cambodia, number 1 university in Cambodia">
<meta name="viewpoint" content="width=device-width, initial-scale=1.0">
</HEAD>
<BODY>
<img src="image/new/ss.jpg" alt="sunset is missing" width="500" height="400" title="sunset">
<p style="background: #f0f; color: purple">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum</p><br>
<b>this is bold</b><br>
<strong>emphasised(it's the same ti bold but it will search engine</strong><br>
<i>this is italic</i><br>
<em>it is the same to italic but the search engine will search it it make our website show on the top e.g SEO</em><br>
<s> cross the text similar to delect</s><br>
<del>similar to s tag too but it will search on the search engine</del>
<u>Underlined text</u></br>
<ins>Inserted Text same to underline</ins></br>
<mark style="background: green">Hilighted Text</mark>
</p>
<p>( q tag="qoute")
<q style="background: yellow">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</q> "incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <blockquote>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur". Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia <cite>[The above info was taken from The Cook book by Nara]</cite> deserunt mollit anim id est laborum. </blockquote>
</p>
<address>
sotherny<br>
Phnom Penh<br>
Cambodia
</address>
<form action="validate.php" method="post" targer="_blank" autocomplete="on">
<fieldset>
<legend>batch 6 section c</legend>
<pre>
username: <input type="text" name="username" placeholder="username">
password: <input type="password" name="password" placeholder="password">
Email : <input type="Email" name="Email" placeholder="ur email">
DOB : <input type="date" name="dob">
choose your file: <input type="file" name="image">
choose ur favorite color: <input type="color" name="color">
choose ur nation:
<input type="radio" name="country" value="cam">Cambodia
<input type="radio" name="country" value="ind">India
<input type="radio" name="country" value="jap">Japan
choose Province:
<select name="province">
<option value="smp">Siem Reap</option>
<option value="pp">Phnom Penh</option>
<option value="kiri">Kirirom</option>
</select>
<input type="submit" value="login">
</pre>
</fieldset>
</form>
<!--18.11.2018 lesson-->
cellspacing is the spcae from one column to one column
cellpadding ( u will see the example)
colspan=5 look at the example in purple first row
<table border="1" align="center" cellpadding="5px" cellspacing="0px">
<th colspan="5" bgcolor="darkorchid" style="color: white">
Student Information
</th>
<tr align="center">
<td>N.o</td>
<td>Name</td>
<td>eamil</td>
<td>city</td>
<td>DOB</td>
</tr>
<tr align="center">
<td>1</td>
<td>SOTHERNY</td>
<td>sotherny@gmail.com</td>
<td>Phnom Penh</td>
<td>17.02.2001</td>
</tr>
<tr align="center">
<td>2</td>
<td>SOTHAKNIA</td>
<td>sothaknia@gamil.com</td>
<td>Phnom Penh</td>
<td>07.07.2003</td>
</tr>
</table>
<table>
<th>
Purple girl
</th>
<tr>
<img src="image/new/ss.jpg" width="50" height="50">
<img src="image/new/ss.jpg" width="50" height="50">
<img src="image/new/ss.jpg" width="50" height="50">
</tr>
</table>
<form>
<table border="0px" align="center">
<th colspan="2" align="center" style="color: white" bgcolor="darkorchid">Login Screen</th>
<tr>
<td>user name: </td>
<td> <input type="text" name="user"></td>
</tr>
<tr>
<td>password: </td>
<td> <input type="text" name="password"></td>
</tr>
<td><input type="submit" name="submit"></td>
<td><input type="submit" name="submit"></td>
</table>
</form>
<!--19.11.2018-->
<pre>general semantic : left to right
1. section
2. article
3. header
4. footer
5. hgroup
6. aside
7. time
8. details
9. summary
10. figure
11. figcaption
12. nav
13. mar
arabic semantic : right to left
14. bdi
15. bdo
chinese semanntic : up to down
16. ruby
17. rt
18. ep
in section tag and article tag has three properties(header; main; footer)
section is the group of
article is indule
footer important
aside less important
time to make the brower understand
</pre>
<section>
<header>Cambodian Famous Food</header>
<main>
<article>
<header>How to make Prahouk</header>
<main>
<ol>ingedient
<li>fish</li>
<li>salt</li>
</ol>
</main>
<footer>tastes from Phnom Penh</footer>
</article>
<article>
<header>
<hgroup>
<h1>ingredient</h1>
<h3>making</h3>
</header>
<main>The prahok ch’oeung is generally used by adding boiling water to some prahok and just using the resulting ‘prahok water’, one of the reasons being the small bones in the fish. With the prahok sach, it’s often chopped finely and put into the dish or used as part of a dip that’s eaten with fresh vegetables.</main>
<aside style="background: purple; color: pink; widows: 10px; height: 30px; width: 200px" align="center">
<p>welcome to prahouk page</p>
</aside>
<footer>smell good</footer>
</article>
</main>
<footer> ® alright reserved to Prahouk page</footer>
</section>
<p>the event schedule on the <time datetime="2018-12-31 18:00+7">new year event</time></p>
<details open="open">
<summary>course offered at KIT</summary>
<ol>
<li>SE</li>
<li>arch</li>
</ol>
<figure>
<img src="image/new/ss.jpg" width="200px" height="200px">
if u increase the picture the in in figcaption will increase but u decrease text will decrease to
<figcaption>the <mark>best</mark> photo</figcaption>
</figure>
</details>
<nav style="background: green; width: 30px; height: 50px" >
<a href="https://www.facebook.com" target="_blank"> FB </a>
<a href="https://www.google.com">GL</a>
<a href="http://www.kit.edu.kh">KIT</a>
</nav>
<!--25.11.2018-->
<p>this is the <span style="color: yellow">span</span> tag. span doesn't leave to new line</p>
<div>
<p>this is paragraph.</p>
<h1>this is heading 1</h1>
</div>
<div style="color: darkorchid; background: green">
<p>div tag leave to new line of the element</p>
<h1>head head head</h1>
</div>
offline
<audio src="audio/abc.mp3" controls="controls"></audio>
<video src="vdo/love song.mp4" controls="controls" width="200px" height="200px"></video>
online vdo
<iframe src=""></iframe>
<iframe width="560" height="315" src="https://www.youtube.com/embed/Ur-P-h49LvQ" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<embed src=""></embed>
<object data=""></object>
teacher sugest us to use only iframe
<object data="insert.html"></object>
<!--26.11.2018-->
<pre>
<code>
inport java.util.*;
public class test
{
public void test()
{
system.out.println("Enter a number...");
}
}
</code>
</pre>
<kbd> enter a number...</kbd>
<samp> $ 10</samp>
<p>hello</p>
</BODY>
</HTML>