Presentasi sedang didownload. Silahkan tunggu

Presentasi sedang didownload. Silahkan tunggu

HTML Lanjut & CSS By : Muhammad Zen S. Hadi Digital Communication Laboratory EEPIS-ITS.

Presentasi serupa


Presentasi berjudul: "HTML Lanjut & CSS By : Muhammad Zen S. Hadi Digital Communication Laboratory EEPIS-ITS."— Transcript presentasi:

1 HTML Lanjut & CSS By : Muhammad Zen S. Hadi Digital Communication Laboratory EEPIS-ITS

2 Objectives Setelah menyelesaikan bab ini, anda diharapkan dapat:  Mengerti tag-tag tentang images di HTML  Memahami tag-tag pembuatan Form dan Frame  Mengerti tag-tag CSS dalam design web  Membuat halaman web dinamis dengan CSS.

3 IMAGE Format image :   GIF (Graphical Interchange Format) (.GIF)   JPEG (Joint Photographic Expert Image) (.JPG)   PNG (Portable Network Graphics) Insert image ke dokumen :

4  Contoh : IMAGE – Cont. 1 Working with Image Working with Image

Aligned at Middle align="middle">Aligned at Middle

5 IMAGE MAP  Image map yaitu suatu area pada image yang bisa kita beri hyperlink area ini biasanya disebut “hot spots”  Coordinat hotspots ditentukan oleh bidang geometry :

6 IMAGE MAP – Cont. 1  Contoh : kotak link alt="kotak link">

7 FORM Kegunaan Form :  memperoleh data-data user baik nama, alamat dan data lainnya untuk mendaftar pada service yang di sediakan.  memperoleh informasi pembelian secara online  memperoleh feedback dari user mengenai website anda.

8 Element Form  Untuk membuat form : …  Untuk membuat form : …

9 HTML Input Element - Button  Atribut : type, value, onclick. Contoh Button Contoh Button function kirim_form () function kirim_form () {window.alert ("Form telah sukses dikirim"); {window.alert ("Form telah sukses dikirim"); window.open ("http://www.microsoft.com"); window.open ("http://www.microsoft.com"); }

Klik tombol dibawah ini. Klik tombol dibawah ini. onclick="kirim_form()">

10  Untuk memasukkan data.  Atribut : type, name, size, maxlength, value. HTML Input Element - Text Nama : Nama : Hobby : Hobby :

11  Atribut : Type, Name, Checked.

Buah yang anda sukai : Buah yang anda sukai : Anggur Anggur Jeruk Jeruk name="melon"> Melon Melon
HTML Input Element - CheckBox

12  Atribut : Type, name, value, checked. HTML Input Element - Radio

Jenis Kelamin : Jenis Kelamin : value="p" checked> Pria Pria value="w"> Wanita Wanita

13  Atribut : cols, rows, name, size. HTML Input Element - TextArea

Komentar anda : Komentar anda :