补充一个表单:
<!--
form 表单 是一个 块级元素, 高度是由内容进行填充的
form 表单 是提交数据 到 后端服务器的
1. method : 请求方式. 默认值是 GET, form一般会使用 POST
浏览器支持的请求方式 主要有 GET, POST
服务器支持的请求方式 有 GET, POST, PUT ,PATCH, DELETE , OPTIONS
GET : 从服务器获取数据,通常用于 查询数据
POST : 发送多个数据给服务器,通常用于 新增数据
PUT : 修改服务器的数据, 通常用于 修改数据
PATCH : 修改服务器的数据, 通常用于 修改部分数据
DELETE : 删除服务器的数据,通常用于 删除数据
OPTIONS : 做预检查的,对复杂的请求(PUT, PATCH, DELETE)验证服务器是否支持
2. action : 设置 请求的地址 URL (网址),默认是 空, 代表发送到当前网址中
3. enctype : 设置 数据的 提交方式, 默认值 application/x-www-form-urlencoded
默认值 代表以 表单的形式( 键值对 )将数据提交到服务器中
multipart/form-data : 以文件上传的方式提交数据
-->
<form method="post" action="https://www.baidu.com">
<!--
所有的表单元素,如果要提交数据,必须设置 name 属性
常见的表单元素有
input 标签, value 属性设置 值
-->
<p>
<label>用户名:</label>
<!--
type 用来设置 input 标签的类型
type = "text" : 纯文本输入框,
readonly 设置 为 只读
-->
<input type="text" name="username" value="zhangsan"/>
</p>
<p>
<label>密码:</label>
<!-- 密码框 type="password" -->
<input type="password" name="password" />
</p>
<p>
<label>性别:</label>
<!--
单选框 type="radio" value属性值在页面是看不到,是提交到服务器的值
单选框 name 属性 必须保持一致,才能产生 互斥现象
通过 checked 属性 设置 该 单选框是否默认被选中,checked是个 boolean值
-->
<input type="radio" name="sex" value="m" checked />男
<input type="radio" name="sex" value="f" />女
</p>
<p>
<label>爱好:</label>
<!--
复选框 type="checkbox"
默认选中 选中 学Java
禁用 游泳 disabled
-->
<input type="checkbox" name="hobby" value="爬山"/>爬山
<input type="checkbox" name="hobby" value="游泳" disabled />游泳
<input type="checkbox" name="hobby" value="学Java" checked />学Java
<input type="checkbox" name="hobby" value="听音乐"/>听音乐
<input type="checkbox" name="hobby" value="跑步"/>跑步
</p>