Rumah >hujung hadapan web >html tutorial >Bagaimana untuk membina borang menggunakan jadual dalam HTML?

Bagaimana untuk membina borang menggunakan jadual dalam HTML?

王林
王林ke hadapan
2023-09-15 21:05:081632semak imbas

Bagaimana untuk membina borang menggunakan jadual dalam HTML?

Jadual ini boleh digunakan untuk mencipta dan menstrukturkan borang dalam format HTML. Tetapi, sebelum itu, mari kita lihat cara membuat borang dalam HTML.

Buat borang dengan HTML

Contoh

Mari kita lihat cara membuat borang menggunakan teg

. Kami menyediakan tiga radio jenis input dengan label berasingan -
<!DOCTYPE html>
<html>
<head>
   <title>HTML Form</title>
</head>
<body>
   <h1>Details</h1>
   <form id="myform">
      <p>Select the subject you want to choose:</p>
      <div>
         <input type="radio" id="prog" name="subject" value="prog">
         <label for="prog">Programming</label>
         <input type="radio" id="dev" name="subject" value="dev">
         <label for="dev">Web Development</label>
         <input type="radio" id="db" name="subject" value="db">
         <label for="db">Database</label>
         </div><br/>
         <div>
         <button id="submit" type="submit">Submit</button>
      </div>
   </form>
</body>
</html>

Buat borang menggunakan jadual HTML

Sekarang, mari tukar borang di atas kepada borang yang dibuat menggunakan jadual HTML.

ditetapkan dalam tag -
<table>
   <form id="myform">
      <!- -
      -->
   </form>
</table> 

Kemudian datang baris di mana kita menetapkan jenis input -

<tr>
   <td>
      <input type="radio" id="prog" name="subject" value="prog">
   </td>
</tr> 

Contoh

Perkara di atas digunakan untuk setiap jenis input, iaitu terdapat satu

untuk setiap input. Sekarang mari kita lihat contoh penuh -
<!DOCTYPE html>
<html>
<head>
   <title>HTML Form</title>
</head>
<body>
   <h1>Details</h1>
   <p>Select the subject you want to choose:</p>
   <table>
      <form id="myform">
         <tr>
            <td>
            <input type="radio" id="prog" name="subject" value="prog">
            </td>
            <td>
            <label for="prog">Programming</label>
            </td>
         </tr>
         <tr>
            <td> <input type="radio" id="dev" name="subject" value="dev"></td>
            <td> <label for="dev">Web Development</label>
            </td>
         </tr>
         <tr>
            <td><input type="radio" id="db" name="subject" value="db"></td>
            <td> <label for="db">Database</label>
            </td>
         </tr>
         <tr>
            <td><button id="submit" type="submit">Submit</button></td>
         </tr>
      </form>
   </table>
</body>
</html> 

Atas ialah kandungan terperinci Bagaimana untuk membina borang menggunakan jadual dalam HTML?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Artikel ini dikembalikan pada:tutorialspoint.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam