PEMROGRAMAN WEB. OLEH : Yunita Prastyaningsih, S.Kom

Ukuran: px

Mulai penontonan dengan halaman:

Download "PEMROGRAMAN WEB. OLEH : Yunita Prastyaningsih, S.Kom"

Erlin Irawan
6 tahun lalu
Tontonan:

1 PEMROGRAMAN WEB MODUL OLEH : Yunita Prastyaningsih, S.Kom

2 Modul 2 1. Tag FONT Untuk memodifikasi sebuah font digunakan tag sebagai pembuka dan tag sebagai penutup. Tag ini mempunyai atribut,diantaranya size untuk menentukan besar ukuran huruf, atribut color untuk menentukan warnanya,serta atribut face untuk menentukan jenis hurufnya. <title>demo membuat Font</title> tulisan ini berwarna hijau,berukuran 10,dan jenisnya impact tulisan ini berwarna merah,berukuran 6,dan jenisnya arial 2. Background Didalam tag terdapat beberapa atribut,atribut tag berada dalam tanda tag tersebut. Atribut tersebut ada yang memiliki nilai tetapi ada juga yang tidak. Tag memiliki atribut. Untuk diperhatikan, jika gambar tidak berhasil ditampilkan maka cobalah untuk memindahkan letak file gambar ke folder dimana file.html berada. <body bgcolor= > Contoh background menggunakan warna <title>atribut Tag</title> <body bgcolor= red > Demo menggunakan atribut tag

3. Membuat daftar List Dalam menggunakan document HTML,adaa kalanya kita perlu membuat suatu daftar (list) atau kumpulan item tertentu. Daftar item tersebut dapat ditulis secara berurutan atau tidak.

3 3. Membuat daftar List Dalam menggunakan document HTML,adaa kalanya kita perlu membuat suatu daftar (list) atau kumpulan item tertentu. Daftar item tersebut dapat ditulis secara berurutan atau tidak. Jenis-jenis daftar tersebut menggunakan tag-tag yang telah disediakan dalam HTML Jenis daftar dibedakan menjadi 2, yaitu: a. daftar yang terurut b. daftar yang tidak terurut Daftar yang terurut (Ordered List) Daftar yang terurut biasanya ditandai dengan penggunaan aturan penomoran tertentu,contohnya menggunakan angka (1,2,3..) atau karakter alphabet tertentu (a,b,c.. atau i ii iii..) kita perlu menggunakan tag <ol> sebagai pembuka dan tag </ol> sebagai penutup. Masing-masing item harus dibuat menggunakan tag <li> yang kemudian harus ditutup dengan tag </li> <title> demo membuat Ordered List</title> <ol>ordered list <li>satu</li> <li>dua</li> <li>tiga</li> </ol>

4 Dalam keadaan default penomoran <ol> akan menggunakan angka(1,2,3..) tetapi kita bisa menggantinya dengan karakter laen yakni menyertakan atribut TYPE pada tag <ol> TYPE A : penomorannya berupa A,B,C. TYPE a TYPE I TYPE i : penomorannya berupa a,b,c. : penomorannya berupa I,II,III. : penomorannya berupa i,ii,iii. Salah satu contoh kode menggunakan atribut TYPE i <title> demo membuat Ordered List</title> <ol type=i>ordered list <li>satu</li> <li>dua</li> <li>tiga</li> </ol>

Catatan: jika kita ingin memulai list dari nomor 8 maka penulisannya <ol start=8> Daftar yang tidak terurut (Unordered List) Daftar yang tidak terurut adalah daftar yang item-itemnya dapat diubah

5 Catatan: jika kita ingin memulai list dari nomor 8 maka penulisannya <ol start=8> Daftar yang tidak terurut (Unordered List) Daftar yang tidak terurut adalah daftar yang item-itemnya dapat diubah posisinya secara acak yang menggunakan tag <ul> sebagai pembuka dan tag </ul> sebagai penutup, Masingmasing item harus dibuat menggunakan tag <li> yang kemudian harus ditutup dengan tag </li> <title> demo membuat Unordered List</title> <ul>unordered list <li>satu</li> <li>dua</li> <li>tiga</li> </ul>

6 Dalam keadaan default <ul> akan menggunakan tanda bulat tetapi kita bisa menggantinya dengan karakter laen yakni menyertakan atribut TYPE pada tag <ul> TYPE DISK = gambar bulat yang diarsir (default) TYPE CIRCLE = gambar bulat yang tidak diarsir TYPE SQUARE = gambar kotak <title> demo membuat Unordered List</title> <ul type= square >unordered list <li>satu</li> <li>dua</li> <li>tiga</li> </ul> Daftar bersarang ( Nested List ) Untuk membuat daftar bersarang (item maupun subitem) memiliki daftar lagi, untuk melakukan ini kita perlu menyertakan tag <ol> atau <ul> didalam item bersangkutan <title> daftar bersarang</title> <ol> <li>nasi

7 <ul> <li>nasi putih</li> <li> nasi kuning</li> </ul> </li> <li>sayur</li> </ol> Definition List Tag tag pada definition list: <dl>.</dl> Tag ini digunakan untuk membuat sebuah definisi dari sebuah list,jenis daftar ini dibuat menggunakan tag <dl> sebagai pembuka dan tag </dl> sebagai penutup. <dt>.</dt> item yang menjelaskan list dari sebuah definisi <dd>.</dd> Tag ini menjelaskan item dari sebuah list definisi <title>pemrograman web</title> <dl> definisi list <dt> item pertama </dt> <dd> sub item pertama </dd> <dt> item kedua </dt> <dd> sub item kedua </dd>

8 <dt> item ketiga </dt> <dd> sub item ketiga </dd> </dl> TUGAS KELOMPOK : Buatlah kode html yang sesuai tampilan berikut dibawah ini 1 kelompok terdiri 3 orang Kode yang digunakan mecakup semua yang ada di modul 2

dokumen-dokumen yang mirip

Dasar-dasar Web dan HTML Minggu I. Pemrograman Web - Rosa Ariani Sukamto

Dasar-dasar Web dan HTML Minggu I Pemrograman Web - Rosa Ariani Sukamto Email: rosa_if_itb_01@yahoo.com Ngapain Sih? Ya Belajar Membuat website dengan HTML dan PHP Layanan-layanan Internet layanan informasi