MENAMBAHKAN GAMBAR DI WEBSITE
Nama tag nya atau tag yang digunakan adalah <img> atau image, tag ini tidak mempunyai tag penutup. Atribut untuk tag ini yaitu :
- src yaitu untuk menentukan sumber gambar dan nama gambar.
- Width yaitu untuk menentukan lebar gambar.
- Height yaitu untuk menentukan tinggi gambar.
- Alt yaitu untuk teks alternatif jika gambar tidak dapat ditampilkan.
- Tittle yaitu untuk membuat text yang tampil ketika mouse diatas gambar.
- Jika gambar terletak pada satu folder dengan file html, maka penulisannya src=”nama_gambar.jpg”.
- Jika gambar terletak didalam folder yang berada di folder yang sama dengan file html, maka penulisannya menjadi src=”nama_folder/nama_gambar.jpg”.
- Yang ketiga ini lebih simple, yaitu kalian ambil gambar dari internet kemudian salin link lalu letakkan pada atribut src=”link_gambar.jpg”.
Hasil :
Penjelasan:
Yang muncul di website ada dua type gambar yaitu yang pertama, gambarnya tidak terlihat tetapi ada keterangan "stiker lucu", karena pada codingannya menggunakan atribut alt yaitu akan muncul teks jika gambar tidak dapat ditampilkan. Kedua, gambar ditampilkan dengan format gambar gif, jika anda mencoba nanti gambar tersebut akan bergerak.
MENAMBAHKAN LINK DI HTML
Link adalah sebuah pintasan untuk menuju ke URL website, baik halaman pada website maupun halaman pada website lain. Tag yang digunakan yaitu tag <a> ... </a>, dan tag ini juga mempunyai atribut, yaitu :
- Href yaitu untuk menentukan tujuan link ketika diklik.
- Target yaitu menentukan target yang dituju ketika di klik akan di tab yang sama atau tab lain.
- Title yaitu menentukan tulisan yang tampil saat mouse memasuki area link.
- Href yaitu tujuan dari link diatas menuju ke youtube dan google.
- Target dengan nilai _blank yaitu akan mengarah ke tab baru jika link di klik.
- Tag <br> yaitu untuk garis baru atau enter.
Hasil :
FORMULIR
Formulir yaitu penginputan data oleh pengguna pada website. Data yang diinput akan disimpan pada database atau basis data. Tag yang digunakan yaitu <form> ... </form> dan mempunyai atribut sebagai berikut.
- Action yaitu menentukan nama file yang akan memproses data yang dikirim.
- Method yaitu mengatur metode pengiriman data, bisa diisi get ataupun post.
- Method get, hanya dapat mengirim data
dalam ukuran kecil dan data yang dikirim akan ditampilkan pada addres bar
browser.
- Method post, dapat mengirim data dalam ukuran besar dan data tidak ditampilkan pada address bar.
- Name yaitu mengatur nama form.
<input>
Yaitu digunakan untuk membuat inputan dengan berbagai macam tipe, dan atribut pada tag ini, yaitu:
- Name, yaitu memberikan nama untuk identitas data yang dikirim.
- Value, yaitu memberi nilai data yang akan dikirim.
- Size, yaitu mengatur ukuran alat input.
- Placeholder, yaitu teks melayang yang tampil saat nilai kosong.
- Disable, yaitu membuat input yang tidak dapat diubah isinya.
- Readonly, seperti disable tetapi masih bisa diubah nilainya dengan script.
- Type, yaitu menentukan tipe dari alat input.
- Id, yaitu memberikan identitas data yang akan dikirim.
Khusus tipe radio dan checkbox mempunyai atribut checked. Adapun
macam-macam tipe input yang dapat diberikan pada atribut type, yaitu:
- Text, yaitu untuk memasukkan teks biasa
- Hidden, yaitu untuk menyembunyikan input.
- Password, yaitu Untuk memasukkan password
- Radio, yaitu untuk memberikan pilihan beberapa nilai yang dapat dipilih dengan cara di klik
- Checkbox, yaitu untuk memberikan pilihan dengan cara di centang.
- Submit , yaitu untuk membuat tombol yang akan mengirim data ketika di klik.
- Reset, yaitu untuk membuat tombol yang akan mengosongkan formulir ketika di klik.
- Button, yaitu untuk membuat tombol biasa yang memiliki fungsi lain.
Pada HTML 5 ada penambahan beberapa tipe input, yaitu:
- Color, yaitu untuk memilih warna
- Time, yaitu untuk memasukkan waktu
- Number, yaitu untuk memasukkan khusus angka
- Range, yaitu untuk memilih angka pada batas tertentu dengan cara menggeser slider
- Date, yaitu untuk memasukkan tanggal
- Email, yaitu untuk memasukkan email
- Url, yaitu untuk memasukkan alamat website
<select> ... </select>
Digunakan untuk membuat input yang berupa pilihan dengan bentuk dropdown.
Pada tag ini kemungkinan pengguna dapat memilih lebih dari satu pilihan dengan
diberi atribut multiple. Untuk menambahkan pilihan menggunakan tag
<option> ... </option> yang ditulis dalam tag select.
<textarea> ... </textarea>
Digunakan untuk input yang dapat diisi teks dengan jumlah yang banyak dan lebih dari satu garis. Misalnya, untuk menginput pesan, komentar, berita dan lain-lain. Atribut yang digunakan sama, tetapi ada beberapa tambahan, yaitu:
- Cols, yaitu untuk mengatur jumlah huruf yang bisa diinpukan dalam 1 baris
- Rows, yaitu untuk mengatur jumlah baris yang dapar dimunculkan tanpda scroll.
<label> ... <label>
Digunakan sebagai pelengkap data atau memperjelas data yang akan diinput oleh pengguna, dan akan bisa mengklik otomatis atau mengaktifkan dari data tersebut.
Sekian materi pembelajaran yang bisa saya sharing. Semoga bermanfaat untuk teman - teman semua yang masih sama - sama pemula dan masih terus belajar mempelajari tentang pemrograman dengan baik dan benar.
Tags:
Program




