PENGATURAN TAMPILAN WEBSITE II Bandung 2009, by hery dwi y
TAG GAMBAR Untuk memperbagus tampilan html, maka kadang diperlukan gambar baik gambar yang tetap atau yang animasi. Tag yang dipakai untuk menampilkan gambar adalah tab <img>. Beberapa atribut yang sering digunakan dalam tag ini adalah : 1. src : menunjukan lokasi file gambar 2. border : tebal bingkai gambar 3. width : lebar gambar 4. height : tinggi gambar 5. align : peletakan gambar
Contoh : <html> <head> <title>IMAGE HTML</title> </head> <body> <p><img border=3 src="admin/images/php.gif" width="120" height="64" align="middle">Image dengan border 3 dengan align middle</p> <p><img src="admin/images/php.gif" width="120" height="64" align="right">Image dengan tanpa border dengan align right, gambar ini merupakan gambar resmi simbol dari php.</p> <p><img src="admin/images/php.gif" width="120" height="64" align="left">Image dengan tanpa border dengan align left, </body> </html>
Tampilan
TAG LINK HTML Kelebihan utama dokumen HTML adalah kemampuannya untuk memberikan link dari satu teks dan atau gambar menuju ke dokumenatau bagian lain dalam suatu dokumen. Browser akan menyorot (highlight) teks atau gambar yang diidentifikasi sebagai link dengan warna dan atau garis bawah untuk menunjukkan bahwa itu adalah hperteks link. Untuk membuat sebuah link, maka tag yang dipakai adalah tag <a> dan </a>. Atribut-atribut dari tag ini adalah : 1. href : lokasi yang dituju, bisa alamat internet, file atau folder 2. target : lokasi link tersebut ditampilkan. Gunakan _blank jika ingin menampilkan link yang dituju di browser baru/lain.
Contoh <html> <head> <title>IMAGE HTML</title> <body> <p>Home page ini menyediakan beberapa link ke search engine :</p> <p><a href="http://www.yahoo.com" target="_blank">www.yahoo.com</a></p> <p><a href="http://www.altavista.com" target="_blank">altavista</a></p> <p><a href="http://www.google.com" target="_blank">google</a></p> <p><a href="http://www.php.net"><img border=3 src="admin/images/php.gif" width="120" height="64" align="middle"></a> link dengan gambar</p> <p><a href="http://www.mysql.com"><img border=0 src="admin/images/mysql.gif" width="167" height="87" align="middle"></a> link dengan gambar tanpa border</p> </html>
Tampilan
TAG FORM Kadang-kadang ketika kita berjalan-jalan / surfing, kita diminta untuk mengisikan suatu data yang akan dikirim ke penyedia web site. Data-data tersebut bisa berupa data nama, alamat, no kartu kredit, gambar, atau file. Untuk membuat suatu form yang dapat berinteraksi dengan visitor, maka pengembang web harus membuat suatu form dalam dokumen html-nya. Untuk membuat suatu form dalam dokumen html, tag yang digunakan adalah <form> </form>. Di antara kedua tag tersebut, elemen-elemen form dituliskan.
TAG FORM Perintah umum tag form adalah <form name=”namaform” method="jenismethod" action="fileeksekusi"> disinilah elemen-elemen form ditulis </form>
Jenis Tag Form
Contoh <html> <head> <title>FORM HTML</title> <body> <form method="POST" action="isemg.php"> <p>Text Box <input type="text" name="T1" size="20"></p> <p>Radio Button <input type="radio" value="V1" checked name="R1">Pilihan</p> <p><input type="checkbox" name="C1" value="ON">Pilihan 1</p> <p><input type="file" name="F1" size="7"></p> <p><select size="1" name="D1"> <option selected value="Bandung">Bandung</option> <option value="Jakarta">Jakarta</option> <option>Surabaya</option> </select></p> <p><textarea rows="5" name="S1" cols="27">Disini saya bisa ditulis dalam beberapa paragraf. Saya bisa menampung teks dengan banyak. </textarea></p> <input type="Submit" value="Submit" name="B1"> <input type="button" value="Button" name="B2"> <input type="reset" value="Reset" name="B3"> </form> </html>
Tampilan