表单

采集用户数据的方式

注册、登陆、搜索、选择、留言

form标签

标签用于为用户输入创建 HTML表单。

form属性

1. action：用于指定接收并处理表单数据的服务器程序地址，eg：form action="server.php"
2. method:

   get（浏览器与表单处理服务器建立连接，然后直接在一个传输步骤中发送所有的表单数据）

   post（(1)浏览器将与action属性中指定的表单处理服务器建立联系；(2)浏览器按分段传输的方法将数据发送给服务器）

input标签

input标签的不同type属性，可以形成不同的效果。

label标签

label标签与普通文本标签的区别

个人信息案例

个人信息改观案例

checkbox实现单击

CSS里没有实现单击

我们可以使用labe和input的关联实现单击

实现原理

label和input之间的管理实现单击事件

:checked伪类和~选择符配合实现，单击事件响应

tab选项卡

实际应用与效果收集

tab选项卡本案例

其他标签

fieldset legend

<!--表单分组用-->
<fieldset id="">
    <legend></legend>

</fieldset>

其他标签

textarea-多行文本

<!--多行文本，可以实现留言、评论、修改文章等功能-->
<textarea name="message" rows="10" cols="30">
    多行文本
</textarea>

注意项目使用的时候，经常结合在线编辑器一起使用。

其他标签

select option

<!--下拉选择列表-->
<select name="cars">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="fiat">Fiat</option>
    <option value="audi">Audi</option>
</select>

案例与练习