Minggu, 12 Februari 2017

Tugas 3 : HTML Table & List

Tabel

Buatlah sebuah Tabel seperti gambar terlampir yang memiliki spesifikasi sebagai berikut:

1. Tabel menyimpan 4 informasi: No, Nama (Nama Depan, Nama Belakang), Deskripsi.

2. Judul kolom "No." dan "Deskripsi" menggabungkan 2 baris tabel

3. Judul Kolom "Nama" menggabungkan 2 kolom tabel.

4. Tulisan pada Kolom Judul dibuat rata tengah.

5. Tabel memiliki batas (border) yang bergabung menjadi satu (collapsed)

6. Tabel memiliki caption: 10 Dosen Favorit Saya ('Dosen Favorit' bisa diganti dengan yang lain)

7. Data yang diisi pada tabel memiliki warna background yang berbeda antara baris genap dan baris ganjil (2 poin)


List:

- Buatlah sebuah daftar (list) yang mencantumkan 3 barang yang terdapat di tas Anda dengan menggunakan bullet bertipe: circle

- Buatlah sebuah daftar (list) yang mencantumkan 3 cita-cita terbesar Anda dengan menggunakan poin berupa huruf kecil a, b, c.



Tutorialnya :

1. Pertama tuliskan No,Nama Depan,Nama Belakang, dan Deskripsi di "table header"





2. Kemudian untuk menggabungkan 2 baris tabel No dan Deskripsi gunakan "rowspan"






3, Lalu untuk menggabungkan 2 kolom tabel Nama gunakan "colspan"





4. Untuk membuat tulisan pada Kolom Judul dibuat rata tengah gunakan CSS "text-align: center"





5. Untuk menggabungkan batas (border) menjadi satu (collapse) gunakan CSS "border-collapse: collapse;"




6. Tuliskan caption yang diinginkan di bagian <caption>





7. Dan untuk menambahkan warna background yang berbeda antara baris genap dan baris ganjil gunakan HTML Hex pada bagian CSS id table








8. Selanjutnya pada daftar (list) yang menggunakan bullet bertipe: circle gunakan style="list-style-type:disc"





9. Terakhir untuk daftar (list) yang berupa huruf kecil a,b,c gunakan type="a"



Tidak ada komentar:

Posting Komentar