HTML表单域3 2.10（单选框，复选框以及复位按钮）

最新推荐文章于 2022-05-31 14:46:25 发布

吃人陈乐游刘

最新推荐文章于 2022-05-31 14:46:25 发布

阅读量237

点赞数 2

分类专栏： HTML表单文章标签：网页设计 html html5

本文链接：https://blog.csdn.net/qq_53463161/article/details/116199139

版权

HTML表单专栏收录该内容

9 篇文章 0 订阅

订阅专栏

我们一起来看一下代码如何实现的：

<html>
<head>
    <title>表单域3</title>
</head>
<body>
<center>
    <form name="form_set" method="get" action="#">
        单选框（带有label标签）：<br />
        <label><input type="radio" name="radio" checked="checked" />选项1（初始选定值）</label>
        <label><input type="radio" name="radio" />选项2</label><label><input type="radio" name="radio" />选项3</label><hr />
        复选框：<br />
        <input type="checkbox" name="chk" checked="checked" />选项1 （初始选定值）
        <input type="checkbox" name="chk"/>选项2
        <input type="checkbox" name="chk"/>选项3<hr />
        <input type="reset" value="复位按钮" />
    </form>
</center>
</body>
</html>

radio为单选框，checkbox为复选框

当type=reset的时候就是复位<input />我们之前讲过，他是根据不同的 type 属性值，输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。

实现效果如图所示：