Kumpulan Kode Dasar HTML

Assalaamu'alaikum.. ^^
Apa kabar sobat-sobat G-Ins ?? pastinya pada sehatkan (^^)
Tadi baru aja saya share tentang Mengenal dan Belajar HTML ..
Berikut ini saya kan share lagi masih mengenai HTML, yaitu kode-kode dasar dari HTML (^^)
Kenapa harus tahu kode-kodenya ???
karena agar kita dapat melakukan berbagai pemformatan dalam HTML sesuai dengan kaidah bahasa pemrograman yang berlaku (^^)

Nah.. sekarang saya akan share deh sama kalian tentang kode-kode khusus yang sangat dasar dari pemrograman HTML. Sebenarnya kode-kode ini telah tersedia di tool seperti Dreamweaver dkk, tapi siapa tahu suatu saat kita disuruh pake notepad atau notepad++.

Jadi, ga salah kan buat tahu (^^)
Langsung aja sob, berikut adalah kumpulan kodenya, spesial pake telor (eehhh salah) pake keterangan (^^) :

1. Untuk membuat rata tengah (Center), kita dapat gunakan kode:
<p align="center">G-Ins</p> dan hasilnya adalah: 

G-Ins 

2. Untuk Membuat rata kanan (Right), kita dapat gunakan kode:
<p align="right">G-Ins</p> dan hasilnya adalah:

G-In

3. Untuk membuat rata kiri (Left), kita dapat gunakan kode:
<p align="left">G-Ins</p> dan hasilnya adalah:

G-Ins

4. Untuk membuat huruf bercetak tebal (Bold), kita dapat gunakan kode:

 <b>G-Ins</b> dan hasilnya adalah:

G-Ins

5. Untuk membuat huruf bercetak garis bawah (Underline), kita dapat gunakan kode: 

 <u>G-Ins</u> dan hasilnya adalah:

G-ins

6. Untuk membuat huruf bercetak miring (Italic), kita dapat gunakan kode:

 <i>G-Ins</i> dan hasilnya adalah: 

G-Ins

7. Untuk membuat kombinasi antara Bold, Underline, dan Italic, kita dapat gunakan kode: 

 <b><i><u>G-Ins</u></i></b> dan hasilnya adalah: 

G-Ins

8. Untuk membuat huruf tebal strong, kita dapat gunakan kode:
<strong>G-Ins</strong> dan hasilnya adalah:

G-Ins

9. Untuk membuat huruf tak terlihat (Hidden), kita dapat gunakan kode:
<span style="visibility: hidden">G-Ins</span> dan hasilnya adalah:

(hidden, jadi ga keliatan ^^)

10. Untuk membuat huruf kapital (Uppercase), kita dapat gunakan kode:
<span style="text-transform: uppercase">G-Ins</span> dan hasilnya adalah:

G-INS

11. Untuk membuat huruf Small Caps, kita dapat gunakan kode:
<span style="font-variant: small-caps">Belajar</span> dan hasilnya adalah:

g-ins

12. Untuk membuat huruf kecil dibawah (Subscript), kita dapat gunakan kode:
<p>G_-Ins</p> dan hasilnya adalah:
G-ins 

13. Untuk membuat pangkat (Superscript), kita dapat gunakan kode:
<p>G^-Ins</p> dan hasilnya adalah:
G-Ins (kata "-Ins" disitu ceritanya berbentuk pangkat ^^)

14. Untuk membuat huruf bergaris atas (Upperline), kita dapat gunakan kode:
<span style="text-decoration: overline">G-Ins</span> dan hasilnya adalah:

G-Ins (pokoknya ada garis atasnya, saya edit di Ms. Word. Jadi ga ada Upperline-nya ^^)

15. Untuk membuat huruf bergaris tengah (Strike), kita dapat gunakan kode:
<strike>G-Ins</strike> dan hasilnya adalah:

G-Ins

16. Untuk menentukan jenis huruf (Fonts), kita dapat gunakan kode:
<p><font-family="verdana" >G-Ins</font></p> dan hasilnya adalah:

G-Ins (tergantung jenis huruf yang ada di komputer kalian)

17. Menentukan ukuran huruf (Size), kita dapat gunakan kode:
<p><font-size="15" >G-Ins</font></p> dan hasilnya adalah:

G-Ins

18. Untuk menentukan warna huruf (Color), kita dapat gunakan kode:
<p style="color: green; >G-Ins</p> dan hasilnya adalah:

G-Ins

19. Untuk membuat Bullet berbetuk dot yang bolong, kita dapat gunakan kode:

<ul type="circle">
<li>DOT 1</li>
<li>DOT 2</li>
<li>DOT 3</li>
</ul> dan hasilnya adalah:

• DOT 1 
• DOT 2 
• DOT 3

20. Untuk membuat Bullet berbentuk kotak, kita dapat gunakan kode:
<ul type="square">
<li>DOT 1</li>
<li>DOT 2</li>
<li>DOT 3</li>
</ul> dan hasilnya adalah:

• DOT 1 
• DOT 2 
• DOT 3

21. Untuk membuat Bullet dot berisi, kita dapat gunakan kode:
<ul><li>DOT 1</li>
<li>DOT 2</li>
<li>DOT 3</li>
</ul> dan hasilnya adalah:

• DOT 1 
• DOT 2 
• DOT 3

22. Untuk mengatur posisi Bullet, kita dapat gunakan kode:<blockquote>
<blockquote>
<blockquote>
<ul>
<li>DOT 1</li>
<li>DOT 2</li>
<li>DOT 3</li>
</ul>
</blockquote>
</blockquote>
</blockquote> dan hasilnya adalah:

• · DOT 1
• · DOT 2
• · DOT 3

23. Untuk menentukan kombinasi antara warna, jenis dan ukuran huruf, kita dapat gunakan kode:
<p><font style="color: red; font-family: verdana; font-size: 15px;" >G-Ins</font></p> dan hasilnya adalah:

G-Ins

24. Untuk membuat Tabel yang memiliki Border Solid, kita dapat gunakan kode:
<table border="1" width="200">
<tr>
<td style="border-style: solid">G-Ins</td>
</tr>
</table> dan hasilnya adalah:

G-Ins

25. Untuk membuat Tabel yang memiliki Border Dot, kita dapat gunakan kode:
<table border="1" width="200"
style="border-style: dotted">
<tr>
<td border="2" style="border-style:
dotted">G-Ins</td>
</tr>
</table> dan hasilnya adalah:

G-Ins

26. Untuk membuat Tabel yang memiliki Border Dashed, kita dapat gunakan kode:
<table border="1" width="200" style="border-style: dashed">
<tr>
<td style="border-style: dashed">G-Ins</td>
</tr>
</table> dan hasilnya adalah:

G-Ins

27. Untuk membuat Tabel yang memiliki Border Groove, kita dapat gunakan kode:
<table border="1" width="200" style="border-style: groove">
<tr>
<td>G-Ins</td>
</tr>
</table> dan hasilnya adalah:

G-Ins

28. Untuk membuat Tabel yang memiiki Border Ridge, kita dapat gunakan kode:
<table border="1" width="200" style="border-style: ridge">
<tr>
<td>G-Ins</td>
</tr>
</table> dan hasilnya adalah:

G-Ins

29. Untuk membuat Tabel yang meiliki Border Insert, kita dapat gunakan kode:
<table border="1" width="200" style="border-style: inset">
<tr>
<td>G-Ins</td>
</tr>
</table> dan hasilnya adalah:

G-ins

30. Untuk membuat Tabel yang memiliki Border Outset, kita dapat gunakan kode:
<table border="1" width="200" style="border-style: outset">
<tr>
<td>G-Ins</td>
</tr>
</table> dan hasilnya adalah:

G-Ins

31. Untuk membuat Tabel Biasa, kita dapat gunakan kode:
<table border="1"width="200"><td>G-Ins</td></table> dan hasilnya adalah:

G-Ins

32. Untuk membuat Tabel Berwarna, kita dapat gunakan kode:
<table border="1"width="200"bgcolor="green"><td>G-Ins</td></tabel> dan hasilnya adalah:

G-Ins

33. Untuk membuat Tabel Berwarna tak Berbingkai, kita dapat gunakan kode:

<table border="0"width="200"bgcolor="blue"><td>G-Ins</td></tabel> dan hasilnya adalah:

G-Ins

Mungkin begitulah sedikitnya kode-kode dasar dari HTML, untuk lebih lengkapnya kalian bisa lihat di tool web developer seperti Dreamweaver, dkk. (^^)
Cape juga nih bikin artikel ini, tapi demi berbagi ilmu pengetahuan saya rela.. (^^)

Selamat Belajar, terimakasih, dan Salam G-Ins.. (^^)