Minggu, 08 Mei 2016

Membuat Link Dan Tabel Dari HTML

       Oke teman kali ini kita akan belajar bagaimanaca cara membuat link dan tebel lewat html dan juga kita akan mengenal atribut-atribut yang dimiliki tabel. pertama tama kita akan belajar bagaimana cara membuat link dengan html

Membuat Link Dengan HTML :
      sebelumnya saya akan menjelaskan sedikit tentang link. link (hyperlink) adalah sebuah acuan dalam dokumen hiperteks(hypertext) ke dokumen lain atau sumber lain.untuk mengenali sebuah link di web biasanya cursor anak panah akan berganti ke cursor bentuk tangan dan tulisan yang memiliki link bisanya memiliki waarna yang terang/berbeda tulisan lainnya.

ada beberapa macam link seperti :

1. INTERLINK
    Interlink (internal link) adalah tautan antar artikel dalam web atau blog, baik artikel lama maupn artikel baru. tujuan agar pengunjung mudah untuk mencari artikel di dalam suatu web atau blog yg dikunjungi

2. EXTERNAL LINK
    External link adalah tautan yang menghubungkan websate atau blog yang satu ke websate atau blog lainnya.

3. BROKEN LINK
    Broken link adalah sebuah tautan yang menghubungkan suatu websate ke websate atau juga url yang tidak tersedia seperti halaman yang biasa kita lihat saat lagi internet "not found"

untuk kode dasar dalam membuat link menggunakan tag <a href="url">text yang mau kita bisa klick</a>
<a> : adalah tag kode dasar dalam pembuatan link
<href> : adalah atribut yang digunakan untuk menghubungkan ke link yang lain

Gambar dalam membuat link dengan html


outputnya 

  
untuk link yang dapat di klick terlihat seperti dibawah :
  
sekarang kita akan belajar bagaimana cara membuat tabel di html seperti yang diatas saya akan menjelaskan dulu bagaimana pengertian tabel beserta atribut yang dimiliki tabel di html

Membuat Tabel Dengan HTML : 

     tabel merupakan cara untuk menampilkan sebuah informasi dalam bentuk kolom dan baris. untuk menampilkan data dalam bentuk table di html kita menggunakan <table><tr><td> 

Tag <table>
Tag <table> adalah pembuka untuk membuat sebuah tabel 

Tag <tr>
Tag <tr> atau table row fungsinya untuk membuat baris pada tabel

Tag <td>
Tag <td> atau tabel data fungsinya untuk menampilkan data pada setiap sel tabel, untuk umumnya table data <tr> ini digunakan untuk membuat kolom dalam baris table

Contoh membuat tabel di HTML


border adalah salah satu dari atribut yang dimiliki tabel gunanya border adalah untuk mendefinisikan ukuran garis tepi dalam bentuk satuan pixels 

hasil output tabel dengan menggunakan <table border="1"> seperti yang diatas

beberapa atribut lainnya yang dimiliki tabel :

1. Cellspacing digunakan untuk membuat spasi antara dua cells dalam satuan pixels

contoh cellspacing dengan menggunkan atribut border

outputnya



 2. Cellpadding digunkan untuk mendefinisikan spasi

contoh cellpadding dengan menggunakan atribut border dan cellspacing


outputnya


3. width digunakan untuk mendefinisikan ukuran tabel dalam satuan pixels 

contoh width dengan menggunkan atribut border dan cellspacing


 output






4. Align digunakan untuk mendefinisikan perataan tabel yaitu perataan tengah, kiri atau kanan

Contoh Align dengan menggunakan atribut 
border, cellspacing,cellpadding, width

contoh diatas menggunakan align="center" (perataan tengah)

outputnya


5. bgcolor digunakan untuk mendefinisikan warna latar belakang

Conoh bgcolor dengan atribut
border,cellspacing,cellpadding,width,align


outputnya


      oh yah sering kali kita membuat tebel baris pertama kita gunakan sebagai judul kolom dari baris-baris di bawahnya. untuk keperluan ini html memiliki tag khusus yang bisa digunakan , yaitu tag <th> (tag head) dalam penggunaan tag <th> kita hanya perlu mengganti tag <td> dengan tag <th> pada baris pertama tabel.

Contoh Tag Header



Output


 Oke teman pembelajaran untuk membuat link dan tabel cukup dari saya mohon maaf bila ada kesalahan . bila teman teman ada yang ingin menambahkan atau melengkapi kekurangan saya dari pembelajaran diatas silahkan berkomentar agar kita saling mendapatkan ilmu dan bisa maju bersama sama.


SEE YOU AGAIN !!!!!!!!!







Tidak ada komentar:

Posting Komentar