Cara Membuat Tabel Pada HTML Beserta Penjelasan Setiap Scriptnya
Pada artikel kali ini saya akan membahas sedikit tentang html, yaitu cara membuat tabel pada html. Dan saya akan jelasin satu persatu script yang saya tulis pada kode html tersebut, agar nantinya paham atau mengerti fungsi - fungsi dari kode yang saya tulis.
Belajar html berarti belajar membuat web, desain web, dan desain template juga bisa. Namun html ini disini yang saya bagikan adalah dasar dari segala kode html yang nantinya bisa dibangun dalam membuat suatu web. Membuat tabel adalah satu dari sekian cara dalam mendesain suatu web.
Baiklah langsung saja diperaktekkan dan dicoba langkah - langkah berikut :
1. Buka Notepad. Untuk membuka notepad dapat mengetikkan "notepad" pada pencarian. Atau Start - All Program - Accessories - Notepad.
2. Jika Sudah tau abaikan cara diatas.
3. Kemudian copy paste script berikut ke notepad
<html>
<head>
<title>Cara Membuat Tabel</title>
</head>
<body>
<font size ="6">
<b><p align="center">Cara Membuat Tabel</p></b></font>
<table border ="1" align="center">
<tr> <td> Nilai Huruf </td>
<td> Nilai Angka </td>
<tr> <td>A</td>
<td>4</td>
<tr> <td>B</td>
<td>3</td>
<tr> <td>C</td>
<td>2</td>
<tr> <td>D</td>
<td>1</td>
<tr> <td>E</td>
<td>0</td>
</tr>
</table>
</body>
</html>
Mengapa saya bilang dasar sekali?Karena dalam membuat html hanya bermodal notepad untuk membangunnya. Tidak harus menginstall software pihak ketiga dan menulis script html tersebut. Tidak ribet saya rasa, mudah, dan cepat. Karena notepad merupakan aplikasi default bawaan windows yang sudah ada ketika windows digunakan.
Baiklah langsung saja diperaktekkan dan dicoba langkah - langkah berikut :
1. Buka Notepad. Untuk membuka notepad dapat mengetikkan "notepad" pada pencarian. Atau Start - All Program - Accessories - Notepad.
2. Jika Sudah tau abaikan cara diatas.
3. Kemudian copy paste script berikut ke notepad
<html>
<head>
<title>Cara Membuat Tabel</title>
</head>
<body>
<font size ="6">
<b><p align="center">Cara Membuat Tabel</p></b></font>
<table border ="1" align="center">
<tr> <td> Nilai Huruf </td>
<td> Nilai Angka </td>
<tr> <td>A</td>
<td>4</td>
<tr> <td>B</td>
<td>3</td>
<tr> <td>C</td>
<td>2</td>
<tr> <td>D</td>
<td>1</td>
<tr> <td>E</td>
<td>0</td>
</tr>
</table>
</body>
</html>
4. Kemudian Save terlebih dahulu file nya sebelum di jalankan.
5. Dengan cara save as - nama file - dan extensi nya html.
contoh : namafile.html
6. Save as type, pilih All Files.
7. Dan Coba jalankan. Maka akan menghasilkan tampilan seperti berikut.
8. Selesai, tabel berhasil di buat.
Namun apakah hanya sebatas, copypaste lalu simpan dan jalankan saja sudah cukup?
Saya rasa sayang sekali kalau hanya sekedar itu. Alangkah baiknya bisa memahami setiap script yang telah dibuat, agar nantinya tidak lah sekedar melihat hasil, tetapi memahami prosesnya.
Ini adalah skript yang telah ditulis tadi.
Cara Membuat Tittle pada tab browser.
Untuk membuat tittle pada tab browser seperti gambar dibawah ini.
Maka script yang digunakan adalah script berikut.
<html>
<head>
<title>Cara Membuat Tabel by Andi Hakim</title>
</html>
</head>
Bisa dicoba dengan membuka notepad baru, dan copypaste kode diatas. Dan coba jalankan.
Judul bebas, tergantung selesai anda.
Selanjutnya kita akan masuk ke body utama dalam sebuah web.
Untuk membuat judul besar seperti ini dapat menambahkan script berikut
<body>
<font size ="6">
<b><p align="center">Cara Membuat Tabel</p></b></font>
Klik save. Dan jalankan.
Script Membuat tabel pada html
Nah, untuk menambahkan tabel dapat menambahkan script dibawah ini.
<table border ="1" align="center">
<tr> <td> Nilai Huruf </td>
<td> Nilai Angka </td>
</tr>
</table>
Pemahaman code nya juga sama seperti diatas. Center berarti di tengah penempatan text nya.
Kemudian, klik simpan dan jalankan.
Saya rasa sudah cukup penjelasan dari saya. Kebetulan saya sudah ngantuk sekali, sudah jam setengah 2 pagi rupanya. Apabila ada yang kurang jelas, dapat tinggalkan komentar dibawah. Semoga bermanfaat. Terima Kasih!
Tidak ada komentar
No Spam / Ads or Outside Links