html fieldset

作者：若此生已赞。发布日期:2026-07-01 浏览:54

<!DOCTYPE html>
<html>
<head>
    <title>HTML Fieldset Example</title>
</head>
<body>
    <form>
        <!-- fieldset is used to group related elements in a form -->
        <fieldset>
            <legend>Personal Information:</legend>
            <!-- legend provides a caption for the fieldset -->
            <label for="fname">First name:</label><br>
            <input type="text" id="fname" name="fname"><br>
            <label for="lname">Last name:</label><br>
            <input type="text" id="lname" name="lname">
        </fieldset>

        <fieldset>
            <legend>Contact Information:</legend>
            <label for="email">Email:</label><br>
            <input type="email" id="email" name="email"><br>
            <label for="phone">Phone:</label><br>
            <input type="tel" id="phone" name="phone">
        </fieldset>
    </form>
</body>
</html>

解释说明：

<fieldset> 标签用于将表单中的相关元素分组，使表单更易于理解。
<legend> 标签为 <fieldset> 提供标题或说明文字。
在上面的示例中，第一个 <fieldset> 包含了个人基本信息（如名字和姓氏），第二个 <fieldset> 包含了联系信息（如电子邮件和电话）。

上一篇：html水平居中

下一篇：html flex布局