HTML <form> 标籤

Definisi dan penggunaan

<form> Tag digunakan untuk membuat borang HTML untuk menerima input pengguna.

<form> Elemen dapat mengandungi satu atau lebih elemen borang berikut:

Lihat juga:

Tutorial HTML:Borang dan Input HTML:

Panduan Referensi HTML DOM:Objek Form:

Tutorial CSS: Tetapkan gaya borang

Contoh

Contoh 1

Borang HTML dengan dua medan input dan tombol sumbit:

<form action="/action_page.php" method="get">
  <label for="fname">Nama:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Keluarga:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Kirim">
</form>

亲自试一试

Contoh 2

Borang HTML dengan kotak centang:

<form action="/action_page.php" method="get">
  <input type="checkbox" name="vehicle1" value="Bike">
  <label for="vehicle1">Saya ada sebuah sepeda</label><br>
  <input type="checkbox" name="vehicle2" value="Car">
  <label for="vehicle2">Saya ada sebuah kereta</label><br>
  <input type="checkbox" name="vehicle3" value="Boat" checked>
  <label for="vehicle3">Saya ada sebuah kapal</label><br><br>
  <input type="submit" value="Kirim">
</form>

亲自试一试

Contoh 3

Form HTML dengan tombol pilihan:

<form action="/action_page.php" method="get">
  <input type="radio" id="html" name="fav_language" value="HTML">
  <label for="html">HTML</label><br>
  <input type="radio" id="css" name="fav_language" value="CSS" checked="checked">
  <label for="css">CSS</label><br>
  <input type="radio" id="javascript" name="fav_language" value="JavaScript">
  <label for="javascript">JavaScript</label><br><br>
  <input type="submit" value="Kirim">
</form>

亲自试一试

Aturan

Aturan Nilai Deskripsi
accept-charset Set karakter Menentukan enkoding karakter yang digunakan saat mengirimkan form.
action URL Menentukan tempat data form akan dikirim saat mengirimkan form.
autocomplete
  • on
  • off
 Menentukan apakah form harus mengaktifkan fungsi penghabisan otomatis.
enctype
  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain
 Menentukan bagaimana data form harus dienkoding saat mengirimkan data form ke server.
method
  • get
  • post
 Menentukan metode HTTP yang digunakan untuk mengirimkan data form.
name Teks Menentukan nama form.
novalidate novalidate Menentukan form tidak harus divalidasi saat mengirimkan form.
rel
  • external
  • help
  • license
  • next
  • nofollow
  • noopener
  • noreferrer
  • opener
  • prev
  • search
 Menentukan hubungan antara sumber tautan dan dokumen saat ini.
target
  • _blank
  • _self
  • _parent
  • _top
 Menentukan di mana respons yang diterima setelah mengirimkan formulir disiarkan.

Kelembagaan Global

<form> Tag masih mendukung Kelembagaan Global HTML。

Kelembagaan Acara

<form> Tag masih mendukung Kelembagaan Acara HTML。

默认的 CSS 设置

大多数浏览器将使用以下默认值显示 <form> 元素：

form {
  display: block;
  margin-top: 0em;
}

亲自试一试

浏览器支持

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 支持 支持 支持 支持