Belajar HTML Membuat Text Box

Posted by Unknown on Friday, November 30, 2012

Belajar HTML Membuat Text Box





















Pernahkah anda melihat tampilan seperti gambar diatas? Namanya adalah text box, kadang ini dipakai dalam membuat form seperti untuk pendaftaran atau memasukkan suatu data. Daripada berbasa-basi langsung saya akan contohkan cara membuat text box sederhana.



Simpan script diatas dengan nama index.html atau terserah anda yang penting ekstensi harus .html. Jalankan pada browser pilihan anda, saya memakai Mozilla Firefox versi terbaru.
Untuk tampilannya sebagai berikut :

Belajar HTML Membuat Text Box



Komponen text box dibuat dengan menuliskan tag berikut :
<input type="text" name="namakomponen"/>
Dengan atribut name diisi dengan nama komponen yang sesuai dengan data isian. Nama komponen harus dituliskan karena akan digunakan pada script pengolah data nantinya.


Untuk membuat tombol kirim berikut tag-nya :
<input type="submit" name="submit" value="Kirim"/>
Tombol ini nantinya akan digunakan untuk mengirim data ke script pengolah data.


Untuk mengatur lebar field text box yaitu dengan menambahkan atribut size="nilai", nilai disini adalah bilangan integer atau angka.
Berikut contohnya :
<input type="text" name="nama" size="40"/>

Atribut lain yang harus dipahami adalah value="nilai". Atribut ini digunakan untuk menampilkan nilai ke dalam text box.
Berikut contohnya :
<input type="text" name="nama" size="40" value="Yogo Prestiyanto"/>
Jika anda menambahkan atribut value seperti contoh diatas, maka akan menjadi seperti ini :

Belajar HTML Membuat Text Box


















Semoga artikel ini bermanfaat !!!



   

13 comments:

  1. Replies
    1. wah caranya mudah di mngerti bt neubi spt ane soal JS HTML..

      http://narrucyber.blogspot.com/

      Delete
  2. Gimana caranya supaya tombol kirin itu respon ke tab selanjutnya??

    ReplyDelete
  3. kalo udah sperti itu, mau melihat tampilannya hasilnya gmana prog html-nya...

    ReplyDelete
  4. Postingannya mudah dimengerti, semoga dapat membantu. Perkenalkan nama saya Merlyn Gebhyanti, Nim 1922500191 link weh kampus saya https://www.atmaluhur.ac.id/

    ReplyDelete
  5. Disini saya baru belajar tentang HTML melihat blog kakak ini sungguh bermanfaat kak,, Nama saya Eko Prayoga, Nim 1922500188 dan link kampus saya https://www.atmaluhur.ac.id/

    ReplyDelete