4/6/2015 Chapter 3 Grouping Elemen Grouping Elemen Penomoran ( listing ) Penomoran ( listing ) Hyperlink dan Image Hyperlink dan Image Created By Barka Satya
4/6/2015 Grouping Element Tag dan digunakan untuk mengelompokkan element-element HTML. Span digunakan untuk mendefinisikan inline content, sementara div digunakan untuk blocklevel content.
4/6/2015 Contoh Div dan Span Divisi 1 Divisi 2 Ini didalam devisi kedua. di tulis dengan alignment kanan. baris ini dalam span dengan warna hijau.
4/6/2015 Contoh 2 Nazneen Online Bookstore NAZNEEN ONLINE BOOKSTORE Jl. Cempaka 143 A Condong Catur Depok Sleman Yogyakarta Telp
4/6/2015 Listing List digunakan untuk mengelompokkan data baik berurutan (ordered list) maupun yang tidak berurutan (unordered list). HTML menyediakan lima cara untuk membuat daftar atau list, yaitu : a. Ordered List b. Unordered List c. Directory List d. Menu List e. Definition List Untuk praktikum ini, hanya ordered list dan unordered list yang dibahas.
4/6/2015 Ordered List Ordered list digunakan untuk membuat daftar dimana setiap bagiannya memiliki nomor secara terurut. Ordered list dimulai dengan tag dan diakhiri dengan. Untuk menyatakan tiap bagiannya digunakan tag dan tidak diperlukan tag penutup. Atribut elemen list,yaitu : Ordered list digunakan untuk membuat daftar dimana setiap bagiannya memiliki nomor secara terurut. Ordered list dimulai dengan tag dan diakhiri dengan. Untuk menyatakan tiap bagiannya digunakan tag dan tidak diperlukan tag penutup. Atribut elemen list,yaitu : TYPE = [ 1 | a | A | i | I ] ( default 1 )
4/6/2015 Contoh <html><head> Ordered List Ordered List <body> <li>Multimedia<li>Database Pemrograman Web Pemrograman Web<li>Ekonomi<li>Hukum</ol></body></html> Created By Ahlihi Masruro, S.Kom
4/6/2015 Unordered List Berbeda dengan ordered list, dalam ordered list tidak dijumpai urutan dalam suatu daftar. Setiap bagian dari unordered list ditandai dengan tanda bullet. Untuk membuat daftar dengan tanda ini digunakan tag awal dan tag penutup dan untuk tiap bagiannya digunakan tag tanpa tag penutup. Atribut elemen list,yaitu : TYPE = [ disc | squre | circle ] ( default disc ) Created By Ahlihi Masruro, S.Kom
4/6/2015 Hyperlink Ini merupakan salah satu keistimewaan yang dimiliki web. Dengan hyperlink ini berbagai halaman web yang berbeda dapat saling dihubungkan. Untuk membuat link Anda dapat menggunakan perintah ancor ( A ). Untuk membuat link ke dokumen HTML lain digunakan perintah berikut : Teks pada browser </A>
4/6/2015 Contoh link1.html<html><head><title>Hyperlink</title></head><body> <li>Multimedia<li>Database Pemrograman Web Pemrograman Web<li>Ekonomi<li>Hukum</ul> Info selengkapnya Info selengkapnya </body></html>
4/6/2015 link2.html<html><head><title>Hyperlink</title></head><body> <li>Multimedia<li>Database Pemrograman Web Pemrograman Web<li>Ekonomi<li>Hukum<li>Arsitektur Desain Grafis Desain Grafis<li>Java</ul> Yuk Kembali... Yuk Kembali... </body></html>
4/6/2015 Image Biasanya, untuk memperindah tampilan web, digunakan image. Ada banyak format image, tapi ada tiga jenis format yang paling sering digunakan, yaitu : o GIF (Graphical Interchange Format) (.GIF) o JPEG (Joint Photographic Expert Image) (.JPG) o PNG (Portable Network Graphics) Standar penulisan tag yaitu : <img src =”file_gambar” ALT =”nama_alternatif”>
4/6/2015 Contoh <html><head><title>Image</title></head><body> Multimedia Database Multimedia Database Pemrograman Web Pemrograman Web</ul></body></html>
4/6/2015 Buatlah Script HTML agar hasilnya tampak seperti berikut ini :