Berikut adalah penjelasan tentang kode dasar HTML
Kutipan teks (blockquote)
Contoh:
<blockquote> Ini sebagai contohnya </blockquote>Hasilnya :
Ini sebagai contohnya
Teks (teletype)
Contoh:
<tt> Ini sebagai contohnya </tt>Hasilnya :
Ini sebagai contohnya Teks miring (
Italic text )
Contoh:
<i> Ini sebagai contohnya </i>Hasilnya :
Ini sebagai contohnya Teks tebal (
Bold text )
Contoh:
<b> Ini sebagai contohnya </b>Hasilnya :
Ini sebagai contohnya Tulisan dicoret (
Strike )
Contoh:
<strike> Ini sebagai contohnya </strike>Hasilnya :
Ini sebagai contohnya Tulisan digarisbawahi ( Underlined text)
Contoh:
<u> Ini sebagai contohnya </u>Hasilnya :
Ini sebagai contohnya Teks ke kiri (Left)
Contoh:
<p style= "text-align: left; "> Ini sebagai contohnya </p>Hasilnya :
Ini sebagai contohnyaTeks ke tengah (Center)
Contoh:
<p style= "text-align: center; "> Ini sebagai contohnya </p>Hasilnya:
Ini sebagai contohnya
Teks ke kanan (Right)
Contoh:
<p style= "text-align: right; "> Ini sebagai contohnya </p>Hasilnya :
Ini sebagai contohnya
Bullet Numberring
Contoh:
<li> Ini sebagai contohnya </li>Hasilnya :
Ini sebagai contohnya Agar menjorok kedalam anda bisa menambahkan
<ul> dan
</ul>Contoh:
<ul><li> Ini sebagai contohnya </li></ul>Hasil:
Teks lebih besar (Big text)
Contoh:
<big> Ini sebagai contohnya </big>Hasilnya :
Ini sebagai contohnya Teks lebih ke kecil (Small text)
Contoh:
<small> Ini sebagai contohnya </small>Hasilnya :
Ini sebagai contohnya Teks agak ke bawah (subscript)
Contoh:
<sub> Ini sebagai contohnya </sub>Hasilnya :
Ini sebagai contohnya Teks agak ke atas (superscript)
Contoh:
<sup> Ini sebagai contohnya </sup>Hasilnya :
Ini sebagai contohnya Kotak teks area
Contoh:
<textarea> Ini sebagai contohnya </textarea>Hasilnya :
Untuk mengubah besar kolom dan barisnya
Anda bisa menambahkan kodenya menjadi
Contoh:
<textarea rows="3" cols="30"> Ini sebagai contohnya </textarea>
Hasilnya :
Untuk mengganti ukurannya tinggal ganti angkanya saja
Membuat tabel
Tag <tr> Mendefinisikan baris dalam tabel HTML
Tag <th> Mendefinisikan header cell pada tabel HTML
Tag <td> Mendefinisikan standard cell pada tabel HTML
Sebuah tabel HTML memiliki dua macam cell :
Header cells – berisi informasi header (dibuat dengan elemen th)
Standard cells – berisi data (dibuat dengan elemen td)
Teks dengan elemen th akan tebal dan ke tengah
Teks dengan elemen td akan biasa dan letaknya di kiri.
Contoh :
<table border= "1 "><tr><th>Tabel 1</th><th>Tabel 2</th></tr><tr><td>Tabel 3</td><td>Tabel 4</td></tr></table>Hasil :
Tabel 1 | Tabel 2 |
Tabel 3 | Tabel 4 |
Catatan : angka 1 bisa diganti angka 2,3,dst untuk jenis border tabel.
Jika masih bingung bisa langsung dipraktekkan
DisiniMembuat tulisan ke bawah (Enter)
<br />Caranya sisipkan kode tersebut pada kode yang ingin buat menjadi enter atau ke bawah
Membuat tulisan berkedip (blink)
<blink> Ini sebagai contohnya </blink>Hasilnya :
Membuat tulisan bergerak atau berjalan (marquee)
<marquee> Ini sebagai contohnya </marquee>Hasilnya :
Secara default maka tulisan akan bergerak dari kanan ke kiri
Agar bisa ke arah lainnya tambahkan kodenya menjadi sebagai berikut :
Bergerak ke atas
(up)<marquee direction= "up "> Ini sebagai contohnya </marquee>
Hasilnya :
Bergerak ke bawah (down)
<marquee direction= "down "> Ini sebagai contohnya </marquee>Hasilnya :
Bergerak ke kiri (left)
<marquee direction= "left "> Ini sebagai contohnya </marquee>Hasilnya :
Bergerak ke kanan (right)
<marquee direction= "right "> Ini sebagai contohnya </marquee>Hasilnya :
Anda bisa mengganti tulisan up dengan down, left, atau right untuk mengganti arah tulisan.
Membuat link pada tulisan atau teks
<a href= "Masukkan link anda di sini"> Masukkan teks anda di sini</a>Contoh :
<a href= "http://berita-unik.cyber4rt.com/"> Home</a>
Hasilnya :
HomeMembuat link pada gambar
<a href="Masukkan link anda di sini "><img border= "0 " width= "Masukkan ukuran lebar gambar anda " src= "Masukkan lokasi gambar anda " height= "Masukkan ukuran panjang atau tinggi gambar anda "/></a>Contoh :
<a href= "http://www.ziddu.com/download/9335414/PrimoPDF.zip.html"><img border= "0 " width= "0 " src= "http://www.indonesiaindonesia.com/imagehosting/images/83751/1_Download.gif" height= "0 "/></a>Hasilnya >
Nah biasanya kita menggabungkan kode ini dengan kode textarea untuk bertukar banner. <textarea> dan </textarea>
<a href=" http://berita-unik.cyber4rt.com /" target="blank"><img border="0" alt="Tutorial Blog" src="http://i1002.photobucket.com/albums/af149/Imtikhan/cooltext442868955-1.gif" /></a>Hasil:
Mengganti warna teks
<span style= "font-family: Arial; color: #Masukkan kode warna di sini; ">Masukkan teks anda di sini</span>Contoh :
Warna biru
<span style= "font-family: Arial; color: #0000ff; "> Ini sebagai contohnya </span>Hasilnya :
Ini sebagai contohnya Untuk kode warna html bisa dilihat
DisiniMembuat efek stabilo pada tulisan
<span style= "background-color: Masukkan kode warna di sini ; "> Masukkan teks anda di sini</span>Contoh :
<span style= "background-color: #00ff00 ; "> Teks yang distabilo </span>Hasilnya :
Teks yang distabilo Untuk kode warna html bisa dilihat
DisiniMengganti background tulisan dengan gambar
<div style= "background:url(Masukkan lokasi gambar anda) no-repeat; "><span style= "color: #Masukkan kode warna di sini; ">Masukkan teks anda di sini</span></div>Contoh :
<div style= "
background:url(http://i1002.photobucket.com/albums/af149/Imtikhan/background_posting.jpg)no-repeat; "><span style= "color:
#000000; ">
Ini sebagai contohnya </span></div>
Hasilnya :
Ini sebagai contohnya
Untuk menggunakan enter silahkan tambahkan kode <br/>
Maka anda akan mendapatkan tulisan dengan ada background dibelakangnya
Semoga bermanfaat