如何使用HTML中的表格来构建表单？

百变鹏仔 4个月前 (09-21) #HTML

文章标签表单

这些表格可用于创建 HTML 格式的表单并使其结构化。但是，在此之前，让我们看看如何在 HTML 中创建表单。

用 HTML 创建表单

示例

让我们看看如何使用

标签创建表单。我们设置了三种带有单独标签的输入类型收音机 -

<!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>

使用 HTML 表格创建表单

现在，让我们将上面的表单转换为使用 HTML 表格创建的表单。设置在

标记内 -

立即学习“前端免费学习笔记（深入）”；

<table>   <form id="myform">      <!- -      -->   </form></table>

然后是行，其中我们设置了输入类型 -

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

示例

上述内容适用于每种输入类型，即每个输入都有一个

。现在让我们看看完整的示例 -

<!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>

文章推荐

如何使用HTML中的表格来构建表单？

用 HTML 创建表单

示例

使用 HTML 表格创建表单

示例

html代码是什么

值得一学的6个前端HTML+CSS特效

html怎么设置字体

怎么隐藏html标签

html怎么设置编码utf8