Assalamu’alaikum......
Selamat
pagi sahabat blogersss... Kali ini saya
mau men-share kepada sahabat-sahabat tentang “Bagaimana Cara Membuat Tabel Menggunakan HTML”. :)
Untuk membuat
tabel menggunakan HTML, kita bisa menggunakan notepad sebagai sarana untuk
menuliskan listing HTML-nya. Tanpa basa-basi, langsung aja yu kita k TKP.....
:D
Ø
Langkah-langkah membuat tabel :
1.
Buka notepad melalui tombol start – All Program –
ketikan “NotePad” pada kolom pencarian.
2.
Simpan dulu file tersebut dengan format *.html.
3.
Mulailah mengetikan listing html pada lembar
kerja tadi.
Saya akan memberikan contoh membuat tabel sebanyak 3
baris & 3 kolom.
<html>
<head>
<title> Membuat Tabel </title>
</head><body><table border="2" width="50%" cellpadding=7>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
b.
Save terlebih dahulu filenya.
c.
Buka file yang kita buat tadi menggunakan web
browser anda. Maka tampilannya akan seperti gambar berikut :
Ø
Langkah-langkah memasukan Tulisan & Foto
Pada Tabel :
1.
Buka notepad melalui tombol start – All Program
– ketikan “NotePad” pada kolom pencarian.
2.
Simpan dulu file tersebut dengan format *.html.
3.
Mulailah mengetikan listing html pada lembar kerja tadi.
Mulailah mengetikan listing html pada lembar kerja tadi.
<html>
<head>
<title> Profil Naruto Shippuden </title>
</head>
<body>
<Font size="6"><B><center>Profil Naruto Shippuden</center></font>
<center><table border="5" width="50%" cellpadding=5 cellspacing=2></center>
<tr>
<td><center><B> Nama Mahasiswa </B></center></td>
<td><center><B> Jurus </B></center></td>
<td><center><B> Foto </B></center></td>
</tr>
<tr>
<td><font size="5"><B> Naruto Uzumaki <B></font></td>
<td><B><center> Rasengan </center></B></td>
<td><center><img src="naruto1.png" width="100"></center></td>
</tr>
<tr>
<td><font size="5"><B> Sasuke Uchiha <B></font></td>
<td><B><center> Chidoori </center</B></td>
<td><center><img src="sasuke1.png" width="100"></center></td>
</tr>
</table>
</body>
</html>
Ket :
·
Tulisan berwarna merah : Mengatur Ukuran tabel.
·
Tulisan berwarna orange : Untuk memasukan tulisan di tangah & tebal
·
Tulisan berwarna biru : Untuk memasukan gambar (image)
Penting !!! : Untuk gambar yang
ingin di masukan harus d simpan dalam 1 folder dengan file yang anda buat.
4.
Save dulu filenya. Setelah itu buka menggunakan
Web Browser anda, maka hasilnya akan menjadi seperti ini :
Mungkin cukup sekian dulu postingannya ya kawan :) Semoga postingan ini bisa bermanfaat bagi pembaca :)
Wassalamu'alaikum....
0 comments:
Post a Comment