Presentasi sedang didownload. Silahkan tunggu

Presentasi sedang didownload. Silahkan tunggu

Enumerasi, Images & Table

Presentasi serupa


Presentasi berjudul: "Enumerasi, Images & Table"— Transcript presentasi:

1 Enumerasi, Images & Table
Pengembangan Web

2 Enumerasi (List, Unnumbered List, Ordered List)
List item di gunakan untuk mengelompokkan data baik berurutan (ordered list) maupun yang tidak berurutan (unordered list). Ada tiga macam list yang bisa anda tambahkan ke document HTML: Unordered List (Bullet) Ordered List (Numbering) Definition List

3 Unordered List

4 Ordered List

5 contoh

6 Horizontal Line <hr> membentuk garis pemisah mendatar.
Bentuk penulisan lain yang dianjurkan (XML style) : <hr />

7 Background Digunakan untuk memberikan warna/image latar belakang pada elemen html Bisa ditempatkan pada elemen html seperti <body> <table> <tr> <td>, dll.. Tag yang digunakan Menggunakan warna: <body bgcolor="#000000"> <body bgcolor="rgb(0,0,0)"> <body bgcolor="black">

8 Menggunakan image: <body background="clouds.gif">

9 Tag Gambar (Image) <img src="NamaFileGambar">
Atribut src digunakan untuk menentukan source dari image yang akan ditampilkan. Image: ekstensi .GIF, .JPG, atau .PNG. Value lokasi image bisa merujuk ke absolute path src = ”c:/gambar/logo.gif” src = Value lokasi image bisa juga merujuk ke relative path src=”images/logo.gif” src=”../../images/logo.gif”

10 atribut Atribut alt Alt digunakan untuk mendefinisikan alternate text untuk sebuah image Contoh : <img src="boat.gif" alt="Big Boat"> Alt juga akan memberitaukan kepada pengunjung web bila gambar yang apa yang sedang ditampilkan bila gambarnya tidak muncul

11 atribut Atribut align Gunakan atribut align untuk mentukan posisi dari gambar bila diletakan dalam paragraf (tag <p> </p> ) Value dari align : absbottom, absmiddle, baseline, bottom, left, middle, right, texttop, top Contoh : <p> Fakultas Teknologi Informasi <img src=”logo.gif” align=”bottom”> UKSW</p> Align juga bisa digunakan untuk mengatur float dari gambar dalam paragraf, bandingkan kedua contoh berikut :

12 contoh

13 atribut Atribut width dan height
Digunakan untuk menyesuaikan besar image Width (lebar) dan height (tinggi) didefinisikan dalam bentuk pixel.

14 contoh <p> <img src ="logo.gif" align ="left" width="48px" height="48px"> A paragraph with an image. The align attribute of the image is set to "left". The image will float to the left of this text. </p>

15 Menggunakan image sebagai sebuah link
Image juga bisa digunakan untuk menggantikan teks pada link Contoh : <a href=”http://www.google.com”><img src=”logo.gif” border=”0”></a> Perhatikan atribut border=”0” digunakan untuk mengilangkan border pada image yang akan muncul secara otomatis bila image digunakan pada link

16 Tag Tabel <table> definisi tabel </table>
Tag untuk penanda baris adalah <tr> definisi baris </tr> Tag untuk penanda kolom adalah <td>data</td>

17 Contoh pendefinisian tabel :

18

19 Latihan

20 Latihan


Download ppt "Enumerasi, Images & Table"

Presentasi serupa


Iklan oleh Google