HTML
•Als PPSX, PDF herunterladen•
0 gefällt mir•289 views
Dokumen tersebut membahas tentang pengenalan HTML untuk menampilkan gambar, hyperlink, dan form. Element IMG digunakan untuk menampilkan gambar, element A untuk hyperlink, dan element FORM untuk membuat form interaktif dengan berbagai input seperti teks, pilihan, dan textarea.
Empfohlen
Weitere ähnliche Inhalte
Ähnlich wie HTML
Ähnlich wie HTML (20)
Kürzlich hochgeladen
Kürzlich hochgeladen (20)
HTML
- 1. Pengenalan HTML - 3 Image – Hyperlink – Form Matakuliah Pengenalan Internet STMIK Palangkaraya Oleh : Suparno Email : endustong@yahoo.com Blog : www.digdoyo.com
- 2. HTML – Image • Element IMG (Image) digunakan untuk menampilkan gambar. • Element IMG tidak mempunyai tag penutup, mempunyai attribute align, alt (teks alternatif jika gambar tidak tampil), border, height, width, hspace (jarak kosong posisi horizontal), vspace (jarak kosong posisi vertikal), src (lokasi dari gambar disimpan dan nama filenya).
- 3. HTML – Image Syntax : <img align="left"|"right"|"top"|"middle"|"bottom“ alt="text” border="pixel” width="pixel"|"%” height="pixel"|"%” hspace="pixel” vspace="pixel” src="uri"> Contoh : Menampilkan gambar Image050.jpg dari folder images <html> <head> <title>Tampilkan Gambar</title> </head> <body> <img width="160" height="160" src=“./images/image050.jpg"> </body> </html>
- 4. HTML - Hyperlink • Element A (Hyperlink) befungsi untuk menghubungkan ke internal ataupun eksternal halaman web. • Element ini mempunyai attribute href, name, dan target. • Attribute href berfungsi sebagai hypertext reference yang mempunyai nilai URI (uniform resource identifier) yang akan menghubungkan ke eksternal halaman web.
- 5. HTML - Hyperlink • Attribute name berfungsi untuk menghubungkan ke tempat tujuan dalam halaman web (anchor). • Attribute target berfungsi untuk menampilkan halaman web pada suatu jendela frame atau jendela baru. Syntax : • Sintaks: • <a href="uri" name="name“ target="_blank"| "parent"|"_top"|"_self“>..............</a>
- 6. HTML - Hyperlink Contoh : Membuat link ke Yahoo, Google, STMIK Palangkaraya <html> <head> <title>Dafatr Link</title> </head> <body> Berikut adalh daftar link yang bisa dikunjungi : <ol> <li><a href="http://www.yahoo.com">yahoo</a></li> <li><a href="http://www.google.com">google</a></li> <li><a href="http://www.tienythea.wordpress.com">materi</a></li> </ol> </body> </html>
- 7. HTML - Form • Element FORM berfungsi untuk mendefinisikan form interaktif. Element ini mempunyai attribute yaitu action, dan method. • Attribute action berisi aksi terhadap form yang dikirim (URI) dan attribute method berisikan metode form melakukan proses pengiriman (GET/POST).
- 8. HTML - Form Syntax : <form action="action" method="GET"|"POST"> ........................... </form>
- 9. HTML - Form • Element INPUT berfungsi untuk mendefinisikan input yang akan dimasukkan pengguna. Element ini mempunyai attribute name, size, type, value, checked. • Attribute name mendefinisikan nama dari input kontrol form. • Attribute size mendefinisikan ukuran teks pada input kontrol.
- 10. HTML - Form • Attribute type mendefinisikan bentuk-bentuk input kontrol. • Attribute value mendefinisikan nilai awal/reset/submit. • Attribute checked mendefinisikan pilihan terpilih pada type radio/checkbox. • Element ini tidak mempunyai tag penutup dan harus berada di dalam element FORM.
- 11. HTML - Form • Syntax: • <input name="name” size="number” type="text"|"checkbox"|"radio"|"submit"|"reset” value="value” checked >
- 12. HTML - Form • Element SELECT berfungsi untuk mendefinisikan opsi pilihan pada form kontrol. • Element ini mempunyai attribute name, size, multiple (utk banyak pilihan). • Element ini harus berada di dalam element FORM. Syntax: <select name="name” size="number” multiple > ..................... </select>
- 13. HTML - Form • Element OPTION mendefinisikan opsi pilihan pada menu SELECT. Element ini mempunyai attribute selected dan value. • Attribute selected opsi terpilih dan attribute value berisikan nilai element OPTION. Syntax: <option selected value="number" > ..................... </option>
- 14. HTML - Form • Element TEXTAREA berfungsi sebagai input kontrol form untuk memasukkan teks lebih dari satu baris. • Element ini mempunyai attribute name, cols, rows. • Attribute name mendefinisikan nama input kontrol form element textarea. • Attribute cols mendefinisikan jumlah kolom textarea yang terlihat.
- 15. HTML - Form • Attribute rows mendefinisikan jumlah baris textarea yang terlihat. • Element ini harus berada di dalam element FORM Syntax: <textarea name="name” cols="number” rows="number" > ..................... </textarea>
- 16. Perbedaan Beberapa Script • HTML :: Membuat halaman web statis.. • JScript :: Biasanya bisa menampung sebuah variabel. Misalnya ada 2 buah textbox, dari dua textbox tsb di masukan angka. Ketika ditekan tombol maka muncul hasil perhitungan dari kedua angka tersebut di textbox ketiga. Selain itu juga bisa memodifikasi tampilan website. (Untuk tampilan biasanya digunakan CSS). • PHP :: Hampirsama dengan html tapi ada tambahan bahwa : Data yang dimasukan melalui textbox bisa disimpan dlm database (Jika ditambah MySQL) atau ditambahkan VARIABEL seperti pada JScript.