Kumpulan kode-kode dasar HTML



Kali ini saya akan share tentang kumpulan kode dasar pada HTML. jadi post ini bukan untuk para master namun untuk pemula.

1. Membuat baris baru
<br/>

2. Membuat paragraf baru
<p>

3. Teks tebal
<b>Teks disini</b>

4. Teks ketik
<tt>Teks disini</tt>

5.Teks bercoret
<s>Teks disini<s>

6. Teks garis bawah
<u>Teks disini</u>

7. Teks sup atas
<sup>Teks disini</sup>

8. Teks sub bawah
<sub>Teks disini</sub

9.Teks rata kiri
<div style=”text-align:left;”>Teks rata kiri</div>

10.Teks rata kanan
<div style=”text-align:right;”>Teks rata kanan</div>

11. Teks rata kanan kiri
<div style=”text-align:justify;”>Teks disini</div>

12. Teks berada di tengah
<div style=”text-align:center;”>Teks disini</div>

13. Teks baris pertama menjorok ke dalam
<p style=”text-indent:30px;”>Teks disini</p>

14. Teks menjorok ke dalam semua
<blockquote>Teks disini</blockquote>

15. Teks berwarna
<span style=”color:#f00″>Teks disini</span>

16. Teks stabilo
<span style=”background:#0f0;color:#f00″>Teks disini</span>

17. Membuat textarea
<textarea cols=”20″ rows=”2″>teks disini</textarea>

18. Textarea huruf warna
<*textarea name=”code” rows=”3″ cols=”20″ style=”;color:#ff0000;”>Teks disini</textarea>

19. Textarea dengan bingkai
<textarea name=”code” rows=”3″ cols=”20″ style=”border:5px inset #00ffff;”>Teks disini</textarea>

20. Textarea dengan bingkai dan huruf berwarna
<textarea name=”code” rows=”3″ cols=”20″ style=”color:#ff1493;border:5px inset #9932cc;”>Teks disini</textarea>

21. Textarea dengan background
<*textarea name=”code” rows=”3″ cols=”20″ style=”background:#ff6347;”>Teks disini</textarea>

22. Textarea dengan background dan bingkai
<*textarea name=”code” rows=”3″ cols=”20″ style=”background:#000080;border:5px inset #ff7f50;”>Teks disini</textarea>

23. Textarea dengan background dan bingkai serta huruf berwarna
<textarea name=”code” rows=”3″ cols=”20″ style=”background:#9932cc;color:#ff6347;border:5px inset #ff1493;”>Teks disini</textarea>

24. Textarea dashed
<textarea name=”code” rows=”3″ cols=”20″ style=”background:#0f0;color:#295F00;border:5px #295F00 dashed;line-height:1.5em;padding:5px;”>Teks disini</textarea>

25. Textarea dotted
<textarea name=”code” rows=”3″ cols=”20″ style=”background:#ef0090;color:#FFEFF9;border:5px dotted #FFEFF9;line-height:1.5em;padding:5px;”>Teks disini</textarea>

26. Membuat garis
<hr>

27. Membuat garis warna
<hr style=”color:red”>

28. Mengatur ukuran garis
<hr style=”color:#00f” width=”60%”>

29. Garis sebelah kiri
<hr style=”color:#00f” width=”60%” align=”left”>

30. Garis sebelah kanan
<hr style=”color:#00f” width=”60%” align=”right”>

31. Membuat garis dengan background
<hr style=”height:3px;background:#00f;color:#f00;”>
32. Garis titik-titik
<div style=”border-bottom:3px dotted #00f;”></div>

33. Garis putus-putus
<div style=”border-bottom:3px dashed #00f;”></div>

34. Membuat daftar
Daftar 1
Daftar 2
Daftar 3
<ul>
<li>Daftar 1</li>
<li>Daftar 2</li>
<li>Daftar 3</li>
</ul>

35. Menampilkan Link dengan teks
<a href=”http://url-tujuan”>nama link</a>

36. Menampilkan gambar
<img src=”http://url-gambar”&gt;

37. Menampilkan URL gambar dengan Teks
<a href=”http://url-gambar”>nama link</a>

38. Menampilkan link dengan gambar
<a href=”http://url-tujuan”><img src=”http://url-gambar”></a&gt;

39. Menampilkan link dengan gambar dan teks
<a href=”http://url-tujuan”><img src=”http://url-gambar”>teks</a&gt;

40. Merubah ukuran gambar
<img src=”http://url-gambar&#8221; width=”100″ height=”100″>
semakin kecil angkanya maka semakin kecil pula gambarnya

41. Menampilkan gambar di samping post sebelbingkai
<img src=”http://url-gambar&#8221; style=”float:left;margin:0 3px 3px;”>Teks disini

42. Menampilkan gambar di samping post sebelah kanan
<img src=”http://url-gambar&#8221; style=”float:left;margin:0 3px 3px;”>Teks disini

43. Membuat bingkai pada gambar
<img style=”border:5px solid #0f0;” src=”http://url-gambar”/&gt;
untuk mengganti bingkai

Sekian kode dasar html semoga bermanfaat dan menambah wawasan kita semua...



Subscribe to receive free email updates:

0 Response to "Kumpulan kode-kode dasar HTML"

Post a Comment