Belajar HTML Part 5 Menambahkan Iframe & Form

Belajar HTML Part 5 Menambahkan Iframe & Form

Assalamualaikum Wr. Wb

Bertemu lagi dengan saya, sebelumnya kita belajar tentang penggunaan selector class & id. Nah dipertemuan kal ini, kita akan melanjutkan dengan belajar Iframe dan Form. Sobat pasti bertanya-tanya apa itu Iframe dan From dan apa fungsinya ? Langsung aja in dia penjelasannya.

PENGERTIAN

Iframe adalah sebuah tag yang ada pada HTML yang berfungsi untuk menampilkan sebuah webpage ke dalam website yang kita buat. Maksudnya kita dapat menampilkan web orang misal youtube ke dalam web kita tanpa harus membuka web tersebut di tab baru.
Form adalah sebuah tag yang ada di dalam HTML yang berfungsi untuk mengumpulkan data dari pengunjung sebuah website. Karena di dalam tag <form> ini memiliki beberapa element seperti textarea, button, input (nama,password,email), dll.

LATAR BELAKANG

Menginginkan sebuah website yang dapat menerima dan mengetahui data-data dari seorang penjunjung dari web tersebut. Dan juga dapat memberikan layanan lebih kepada pengunjung.

MAKSUD & TUJUAN

Dapat memberikan layanan lebih kepada pengunjung, seperti : tampilan youtube dalam web kita.

Mempermudah dalam mengetahui data data dari seorang pengunjung.

ALAT & BAHAN

Lapot/PC
Koneksi Internet
Text Editor
Browser

LANGKAH KERJA

Iframe

Di dalam HTML pembuatan iframe diawali dengan tag <iframe>. Berikut adalah syntax dari iframe.

<iframe src="URL"></iframe>

Keterangan : "src" digunakan untuk menambahkan alamat tujuan yang ingin ditambahkan.

Kemudian untuk menambahkan sebuah link ke dalam tag <iframe> dengan syntax berikut.

Dan berikut adalah hasilnya.

Itu adalah hasil dari iframe yang kita buat. Selanjutnya kita lanjut menuju ke Form.

Form

Di dalam HTML penggunaan form diawali dengan tag pembuka <form> kemudian ditutup dengan tag </form>. Dan di dalam tag <form> terdapat beberapa <tag> yaitu berikut.

Tag input <input> . Tag ini berfungsi untuk menambahkan type seperti nama(text), password, checkbox, radio, submit, dan masih banyak lagi. Contoh penggunaanya sebagai berikut.

Coba kita jalankan browser kita. Dan lihat hasilnya.

Contoh di atas merupakan bagian dari tag <input> dan masih ada tag <input> yang lainnya.

Selain tag <input> ada juga tag yang lainnya. Seperti tag <textarea>, <button>, <select>, dll.

Selanjutnya kita mencoba tag <texarea>. Tag area ini berfungsi untuk menambahkan sebuah kolom yang biasanya digunakan untuk komentar bagi pengunjung blog. Berikut contoh penggunaanya.

Nb : rows digunakan untuk mengatur tingginya, dan cols digunakan untuk mengatur lebarnya.

Jalankan browser anda kemudian lihat hasilnya. Dan berikut adalah hasilnya.

Selanjutnya kita mencoba ke tag <button>. Tag <button> berfungsi untuk menampilkan button atau tombol dari HTML. Contohnya sebagai berikut.

Nb : syntax onclick="alert(Hello World!") anak menampilkan sebuah pesan yang berisi Hello World! jika di klik tombolnya.

Berikut adalah hasil dari tag <button>.

Selanjutnya kita coba tag <select>. Tag select ini berfungsi untuk menampilkan dropdown atau juga bisa disebut dengan menu kebawah (bingung gak tau namanya). Langsung saja berikut cara penggunaanya.