Cara Membuat Tabel Pada HTML

Assalamualaikum Wr.Wb.

Salam hangat para blogger dan pembaca sekalian, semoga sejahtera dan sehat selalu. Pada kesempatan kali ini saya akan memberikan artikel pada anda mengenai Cara Membuat Tabel Pada HTML. Kita langsung saja pada topik utama kita hari ini.

1. Cara Membuat Tabel
Dalam pembuatan website, tabel berfungsi untuk menampilkan informasi-informasi secara terstruktur, ringkas, dan mudah dibaca serta tampilannya lebih menarik. Tabel biasanya digunakan untuk menampilkan data dari database. Dalam membuat tabel setidaknya dibutuhkan 4 tag yang harus digunakan yaitu <table>, <tr>, <th>, <td>.

Tag-Tag Utama Untuk Pembuatan Tabel

Tag	Keterangan
table	table digunakan untuk memulai membuat tabel
tr	table row berfungsi untuk menyatakan suatu baris didalam tabel.
th	table header digunakan untuk memberi judul baris atau kolom dalam suatu tabel yang dicetak tebal dan posisi defaultnya berada ditengah
td	table data digunakan untuk menyatakan data atau isi dari tabel. Posisi default teksnya di kiri

Berikut ini contoh membuat tabel dengan tag-tag tersebut;
Buka browser anda dan lihat hasilnya akan tampak seperti berikut ini;

Baca Juga: Cara Membuat Hyperlink Di HTML

Tapi kalau kita lihat dari gambar diatas tabel tersebut tidak memiliki garis. Untuk menampilkan garis tersebut kita harus menggunakan properti border dalam tag <table>. Sekarang coba anda tambahkan properti border="1" pada tag <table>.

<table border="1">

Hasilnya akan tampak seperti dibawah ini;

2. Cara Mengatur Lebar dan Tinggi Kolom Pada Tabel
Selanjutnya kita mencoba mengatur ukuran lebar dan tinggi kolom pada tabel. Properti yang harus digunakan untuk mengatur lebar dan tinggi kolom adalah height dan width. Berikut ini saya menyediakan contohnya.
Contoh mengatur lebar kolom;
Hasil dari kode tersebut adalah seperti ini;

Contoh mengatur tinggi kolom;
Hasil dari kode tersebut adalah seperti ini;

3. Mengatur Lebar Tabel
Setelah kita mencoba mengatur lebar kolom pada tabel, sekarang kita akan mencoba mengatur lebar tabel itu sendiri. Properti yang digunakan masih sama yaitu width. Properti width ini ditempatkan atau dituliskan dalam tag <table>. Berikut ini contohnya;
Hasil dari kode tersebut adalah seperti ini;

4. Mengatur Posisi Tabel dan Posisi Teks dalam Tabel

Selanjutnya kita akan mencoba mengatur posisi tabel, dan posisi teks dalam tabel. Properti yang dibutuhkan dalam mengatur posisi ini adalah properti Align. Properti ini bisa digunakan untuk mengatur posisi tabel dan mengatur posisi teks dalam tabel, perbedaannya hanyalah tempat penulisannya. Untuk mengatur posisi tabel dituliskan di bagian tag <table>, sedangkan untuk mengatur posisi teks, dituliskan didalam tag <td>. Properti Align ini terdapat tiga value sering digunakan yaitu left, right, dan center. Berikut ini contohnya;

Hasil dari kode diatas adalah seperti dibawah ini

Klik untuk memperbesar gambar

Baca Juga : Tag Heading Dalam HTML

Nah mungkin segitu saja yang bisa saya tulis dalam artikel mengenai Cara Membuat Tabel Pada HTML ini. Sebenarnya masih ada yang perlu dibahas lagi mengenai cara membuat tabel ini, tapi mengingat saya mempunyai tugas yang belum selesai, saya akan simpan saja untuk postingan yang selanjutnya.

Semoga artikel ini bisa berguna dan bermanfaat bagi kalian yang sedang belajar tentang bahasa MarkUp ini. Nah, kalau menurut anda artikel ini bermanfaat tidak ada salahnya untuk membagikan artikel ini kepada teman-teman kalian, satu klik tombol share dan like sangat berarti bagi. Terima Kasih. Jangan lupa komentar yah..

Wassalamualaikum Wr.Wb

 

Tag Heading Dalam HTML

Assalamualaikum Wr.Wb.

Salam hangat dan semoga sejahtera untuk para blogger dan para pembaca sekalian. Pada kesempatan kali ini saya akan membahas mengenai Tag Heading Dalam HTML. Nah mari kita langsung ke topik utama kita hari ini.

Tag Heading merupakan salah satu element penting dalam HTML yang digunakan untuk membuat judul atau subjudul dalam halaman web. Perlu diketahui juga bahwa penggunaan Tag Heading ini sangat penting dalam meningkatkan SEO web atau blog kita.

Dalam html, tag heading ini memiliki 6 tingkatan, yaitu <h1>, <h2>, <h3>, <h4>, <h5>, dan <h6>. Tag heading <h1> ini memiliki ukuran huruf yang paling besar, dan Tag Heading <h6> memiliki ukuran yang paling kecil. Biasanya tag heading yang sering digunakan dalam membangun sebuah web adalah tag heading <h1> sampai <h3>, tapi ada juga yang menggunakannya sampai <h4>.

Berikut ini contoh penggunaan dari 6 tingkatan Tag Heading;

Buka browser anda dan hasilnya akan terlihat seperti di bawah ini;

Baca Juga: Cara Membuat Tabel Pada HTML

Di bawah ini saya juga menyediakan contoh yang lainnya;

Buka browser anda dan hasilnya akan terlihat seperti dibawah ini;

Seperti yang kita lihat dari kedua contoh diatas, tag heading ini memiliki ukuran font atau huruf  yang berbeda-beda dan memiliki teks cetak tebal pada tiap tingkatannya. Tapi perlu diingat meski memiliki ukuran yang bervariasi dan teks atau huruf yang bercetak tebal, jangan gunakan tag heading ini hanya semata-mata untuk memperbesar ukuran huruf saja, anda harus menggunakan tag heading ini untuk membuat judul atau subjudul, jika anda ingin memperbesar ukuran huruf anda bisa gunakan tag <font size> atau anda juga bisa menggunakan CSS.

Nah mungkin segitu saja yang bisa saya tulis dalam artikel mengenai  Tag Heading Dalam HTML ini,  meski sedikit tapi semoga artikel ini bisa berguna dan bermanfaat bagi kalian semua. Nah, kalau menurut anda artikel ini bermanfaat tidak ada salahnya untuk membagikan artikel ini kepada teman-teman kalian, satu klik tombol share dan like sangat berarti bagi saya.  Terima Kasih
Wassalamualaikum Wr.Wb. 

Membuat Hyperlink di HTML

Dalam postingan kali ini saya akan memberikan tutorial mengenai hyperlink di html.
Saya akan langsung saja jelaskan.
Pertama buat dua buah file html yang akan di hyperlink-kan. Misalnya saya menggunakan linker.html dan tabel.html.

linker.html

\

tabel.html

Setelah membuat atau menentukan file html yang akan di hyperlinkan, selanjutnya adalah memberikan script hyperlink pada salah satu file HTML tersebut.
Script untuk membuat hyperlink pada umumnya sebagai berikut;

<a href="alamat laman"> deksripsi </a><br>

Tambahkan script tersebut ke salah satu file HTML kalian, kalo saya menambahkannya ke file linker.html.
Kemudian ubah alamat laman-nya menjadi alamat file HTMl yang satunya lagi (biar lebih cepat copy-kan saja dari address bar di browser). Lalu ubah juga deksripsinya (bebas).
Ini screenshotnya biar lebih paham...

Klik gambarnya biar lebih jelas...

Nah setelah itu coba di jalankan, maka tampilannya akan seperti dibawah ini

Nah itu dia, sedikit mengenai Cara Membuat Hyperlink di HTML.Mohon Maaf, kalo penjelasan saya kurang dimengerti. Juga tolong kasih kritik atau saran di kolom komentar biar saya lebih baik lagi dalam menulis postingannya.

Mengenal World Wide Web dan HTML

World Wide Web atau biasa disingkat (WWW) atau WEB merupakan salah satu sumber daya internet yang berkembang pesat sekarang ini. Saat ini informasi web didistribusikan melalui pendekatan hyperlink, yang memungkinkan suatu teks, gambar atau objek lainnya menjadi acuan untuk membuka halaman-halaman web yang lain.


Dalam penggunaan WEB pasti tidak terlepas dari yang namanya URL (Uniform Resource Locator). URL ini adalah sarana yang digunakan untuk menentukkan alamat yang diapaki ketika kita menakses internet (website atau homepage).

HTML adalah bahasa komputer yang bisa dipahami oleh semua komputer, yang dipakai di dunia world wide web atau internet. Perintah HTML html harus berada dalam di dalam tanda <...>, yang digunakan untuk menampilkan teks, gambar dan fungsi-fungsi tertentu, misalnya fungsi link.
Berikut ini adalah kerangka dasar dokumen html yang merupakan aturan html, yang dibuat oleh W3 (World Wide Web) Consurtium:
<HTML>
<HEAD>****Bagian Dari Head*****</HEAD>
<BODY>****Bagian Dari Body*****</BODY>
</HTML>


Sumber: Modul Desain Dan Aplikasi Pemrograman Database Berbasis WEB Oleh Tedi Budiman