使用单选框、复选框，让用户选择

最新推荐文章于 2024-04-26 18:45:41 发布

Star_Li_92

最新推荐文章于 2024-04-26 18:45:41 发布

阅读量1.5k

点赞数 3

分类专栏： Web前端 HTML+CSS基础文章标签： html css 基础学习笔记

本文链接：https://blog.csdn.net/yangxingpa/article/details/71195003

版权

Web前端同时被 2 个专栏收录

6 篇文章 0 订阅

订阅专栏

HTML+CSS基础

3 篇文章 0 订阅

订阅专栏

一、引言

html中有两种选择框，即单选框和复选框，两者的区别是单选框中的选项用户只能选择一项，而复选框中用户可以任意选择多项，甚至全选。

二、语法

对应语法：

<input   type="radio/checkbox"   value="值"    name="名称"   checked="checked"/>

1、type:

当 type=”radio” 时，控件为单选框

当 type=”checkbox” 时，控件为复选框

2、value：提交数据到服务器的值（后台程序PHP使用）

3、name：为控件命名，以备后台程序 ASP、PHP 使用

4、checked：当设置 checked=”checked” 时，该选项被默认选中

注意点：

注意:同一组的单选按钮，name 取值一定要一致，这样同一组的单选按钮才可以起到单选的作用。

三、应用

在html文档中书写下列代码。使得性别为单选框。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>单选框、复选框</title>
</head>
<body>
<form action="save.php" method="post" >
    <label>性别:</label>
    <label>男</label>
    <input type="radio" value="1"  name="gender" />
    <label>女</label>
    <input type="radio" value="2"  name="gender" />
</form>
</body>
</html>