Rabu, 09 April 2014

BELAJAR HTML DASAR (4)





Sekarang kita akan belajara mengenai gambar dan yang lainya. oke langsung aja kia masuk ke materi...

Image HTML
Bayangkan apabila di web anda anda berisi tulisan dan tidak ada gambarnya pasti tidak menarik. Gambar di dalam suatu web page merupakan daya penarik bagi pengunjung. Adanya gambar di web anda akan memperindah tampilan. File gambar yang umum digunakan ada 3 jenis format yaitu PNG, GIF, dan JPG. Ketika anda memilih suatu gambar harus memperhatikan dari format gambar yang digunakan karena setiap gambar akan membutuhkan waktu tambahan untuk di download
dan memperlambat awal penampilan suatu dokumen dalam browser. Oleh karena itu, berhati-hatilah dalam memilih gambar dan menyertakannya ke dalam suatu dokumen. Untuk menysipkan gambar pada dokumen html di sediakan secara khusus yaitu Tag <img>.
penulisan sintaksnya : <img src=”url” />

Tag <img> mempunyai atribut di antaranya: Atribut Penjelasan
src : Url dari file image/direktori gambar
align : Letak gambar pada teks, nilai atributnya left, right, top, middle, dan bottom
width : Lebar gambar dalam satuan pixel
height : Tinggi gambar dalam satuan pixel
alt : Menampilkan teks pengganti jika gambar tidak tampil di brows
border : Memberi bingkai pada gambar

#Image Sebagai Link
Gambar bisa digunakan sebagai link untuk suatu dokumen.
contoh : 
<html>
    <head >
         title>Img sebagai suatu link</title>
    </head >
    <body >
        <p>
            <b>Untuk mengunjungi website amikom klik gambar di samping</b>
             <a href="http://www.amikom.ac.id"><img src="amikom.jpg" width="50" height="50" align="middle" alt="Tombol" />
             </a> 
        </p>
    </body>
</html>

Tabel HTML
Tabel dapat digunakan untuk memberikan data dalam bentuk kolom dan baris. Sebuah tabel mempunyai judul, baris untuk informasi, dan sel untuk setiap itemnya. Tabel dapat di isi dengan daftar item, paragraf, form, gambar, teks-teks preformatted, dan bahkan tabel-tabel yang lain (tabel dalam tabel). Untuk membuat tabel digunakan tag awal <table> dan tag penutup </table>. 
Sintaks penulisannya : 
<table>
    <tr>
        <td>Data Tabel</td>
    <tr>
</table>

#Atribut Tag <td> dan <th>

Form dan Input HTML
Form merupakan salah satu elemen HTML yang digunakan untuk mendapatkan masukan dari pengguna web. Pengguna web dapat memasukkan input melalui halaman-halaman HTML. Umumnya pengolahan form dilakukan pada server dengan menggunakan skrip yang bersifat server-side seperti PHP, ASP dan lain sebagainya. ). Untuk membuat form digunakan tag awal <form> dan tag penutup </form>.
Sintaks penulisannya :
<form action=”url” method=”get|post”>
</form>

#Jenis Masukan dalam Form
Text, digunakan untuk mengisi suatu nilai dapat berupa teks atau angka.
Radio, elemen isian berupa pilihan dimana hanya satu pilihan yang dapat dilakukan.
Checkbox, elemen yang menyediakan beberapa pilihan bisa lebih dari satu.
List, elemen pilihan dalam bentuk daftar.
Button, elemen berupa tombol untuk melakukan suatu proses.
Submit, elemen tombol yang digunakan untuk memanggil url.
Reset, elemen tombol yang digunakan untuk mengembalikan kondisi awal.
Image, digunakan sebagai pengganti button, berupa gambar yang dapat melakukan proses.
Textarea, elemen yang dapat menampung kumpulan teks ketikan dari user.
File, elemen button yang dapat memanggil file atau gambar dari storage.
Password, elemen berupa teks yang khusus digunakan untuk mengisi password.

#Tag <TEXTAREA>
Tag <TEXTAREA> digunakan untuk membuat sebuah kotak teks multi baris.

#Tag <SELECT>
Tag <SELECT> digunakan untuk membuat sebuah daftar pilihan.

#Tag <INPUT>
Tag <INPUT> digunakan untuk membuat komponen-komponen yang digunakan untuk meminta informasi dari user, misalnya kotak teks, kotak pilihan, tombol dan lain-lain. Tag ini tidak memerlukan tag penutup.

Tipe input yang dapat dibuat adalah :
Text, digunakan untuk membuat kotak teks
Password, digunakan untuk membuat kotak teks, tetapi semua karakter akan ditampilkan dengan tanda *.
Check Box, digunakan untuk membuat suatu daftar pilihan yang dapat dipilih lebih dari satu.
Radio, digunakan untuk membuat suatu daftar pilihan yang hanya dapat dipilih satu saja.
File, digunakan untuk memanggil file atau gambar dari storage.
Hidden, Digunkan untuk mengirim data ke suatu aplikasi yang tidak dingginkan untuk dilihat oleh browser.
Reset, digunakan untuk membuat tombol yang fungsinya untuk menghapus semua isian form yang telah diberikan.
Submit, digunakan untuk membuat tombol yang fungsinya untuk mengirimkan data form agar diolah.

Elemen Label, Fieldset dan Legend
Elemen label memberikan fasilitas untuk menambahkan teks pada elemen masukan form. Elemen ini diisikan dengan deskripsi dari elemen masukan yang ingin ditambahkan dan harus memiliki atribut for. Atribut for pada elemen label berisikan nilai yang sama dengan atribut id pada elemen masukan form. Pengisian nilai yang sama akan mengikatkan elemen label dengan elemen masukan sehingga pengguna dapat langsung mengisikan nilai dengan melakukan klik teks yang dihasilkan oleh elemen label. Elemen fieldset merupakan elemen yang digunakan untuk membungkus beberapa elemen masukan form, untuk menandakan bahwa elemen-elemen tersebut merupakan elemen masukan yang berada pada satu grup yang sama, atau saling berhubungan. Sedangkan Elemen legend digunakan untuk memberikan judul pada sebuah fieldset.
Sintaks penulisannya :
<fieldset>
       <legend>Judul</legend>
</fieldset>

lihat juga :
materi belumnya

dan sekian pembahasan tentang BELAJAR HTML DASAR dan baca juga arikel HTML 5 nya, semoga bermanfaat untuk semua pembaca, hehe... :)

0 komentar:

Posting Komentar