Sesi 5

Oleh
Assalamualaikum wr. wb.

pertemuan kali ini saya akan menjelaskan cara penyajian pembuatan Tabel & table spanning.

1. Langsung saja yang pertama saya akan menjelaskan Pembuatan Tabel. 
  • Jadi tabel merupakan cara untuk menampilkan imformasi dalam bentuk sel yang terdiri atas baris dan kolom. Untuk menampilkan data dalam bentuk table pada HTML, digunakan tag <table>.
  • Elemen table berisi property <tr> untuk menentukan baris(table row) yang didalamnya terdapat properti <td> untuk menampkan data pada setiap sel table (table data).

  • Struktur Elemen Table : 


·         Untuk mendefinisikan table heading atau judul tiap kolom menggunakan tag <th> … </th>.



2. Atribut Elemen Tabel :


3. Atribut Table Row : 




4. Pembuatan Table dengan spanning.
     Adakalanya  kita mmebuat table dengan menggabungkan baris ataupun kolom.


  • Berikut ini contoh table yang menggabungkan baris : 



  • Berikut ini contoh table yang menggabungkan kolom :




Untuk membuat table seperti yang di atas, maka table atribut data yan digunakan adalah sebagai berikut :

Rowspan =  angka (baris yang di span oleh sel).
Colspan = angka (kolom yang di span oleh  sel)

Jadi untuk menggabungkan  4 baris seperti table di atas adalah : 
<td rowspan=4> ... </td>

Sedangkan untuk menggabungkan 4 kolom seperti table di atas adalah : 
<th colspan=4> ... </th>


Berikut nya saya akan menampilkan contoh pembuatan table dengan HTML.

1.

Hasil : 


2. 

Hasil : 


3. 


Hasil : 


4. 



hasil : 




5. 


Hasil : 


6. 

Hasil : 



7. 

Hasil : 


8. 


Hasil : 


9. 


Hasil : 


10. 


Hasil : 




Nahh itu tadi contoh penerapan table di HTML..
mungkin sekian dari  saya terimakasih Wasslamualaikum wr. wb.




Komentar

Posting Komentar

Postingan populer dari blog ini

Oleh
Gambar
Tugas Program Dasar 1.#include <iostream>   using namespace std;   int(){                 int c                 printf("Masukan nilai : ");                 scanf ("%d" , c);                 printf("Nilai yang anda masukkan adalah = %i", c);                 return 0;}   Kode program di atas memiliki kesalahan penulisan sehingga program tidak dapat dijalankan , kesalahan tersebut adalah ...   (E.Penggunaan Header yang Salah , karena fungsi printf() atau scanf() menggunakan header <stdio.h>) 2.untuk menjalankan operasi I/O terdapat beberapa kelas yang harus d...
Baca selengkapnya

BASIC DASAR CODE::BLOCKS

Oleh
Gambar
Assalamualaikum.. Ok,, gan sebelumnya saya udah berbagi ilmu nih bagaimana caranya menginstal code blocks v17.12 Nah.. kali ini saya akan terusin materi pengalaman saya belajar sebagai siswa RPL... yaitu basic  dasar pemrograman di codeblocks.. ok lah let’s do it… Sebelumnya saya saranin doa dulu biar berkah belajarnya gan…hhe.. Pertama pastinya nyalain dulu computer anda dan buka aplikasi codeblocks Nah kalau udah kebuka klik file > new  > empty file atau bisa juga ctrl + shift + N biar cepet aje gan.. kemudian save ( ctrl + S ) bebas dimana aja,, lalu tambahin .cpp misal belajar.cpp   Second.. (inggris dikit lh biar keren. hhee..) kita mulai proses codingannya.. Pertama anda harus alias wajib  tulis     #include <iostream>  lalu   enter  using namespace std; di setiap  awal codingan. Selanjutnya tinggal pelajari dan masukin code berikut.. tugas 2 #...
Baca selengkapnya

sesi 6

Oleh
Gambar
Assalamualaikum wr. wb Bertemu lagi dengan saya yang kali ini akan memberikan beberapa conoth layout website beserta source code nya. 1. Yang pertama adalah TopIndex, kalian bisa lihat dan pelajari code berikut : Dan hasil dari source code di atas adalah sebagai berikut : 2. Bottom Index Hasilnya akan seperti gambar dibawah ini: 3.Left Index Hasilnya seperti berikut : 4. Layout Split Dan hasilnya seperti berikut : Nahh .. itu tadi beberapa contoh layout yang sering digunakan dalam website. selanjutnya saya kalian bisa isi content atau yang lain nya sesua dengan keinginan kalian. contohnya saya membuat dan mengisi dari satu layout di atas sebagai berikut : Source Code : Hasil dari sourc Code nya seperti dibah ini : Ok.. itu tadi beberapa contoh layout website. Terimakasih atas kunjungan nya, mohon maaf apabila banyak kesalahan.. Wassalamualaikum wr. wb.
Baca selengkapnya