HTML基础教程8——表单标签

HTML基础教程8——表单标签

表单基础

表单用<form>标签表示，表单用于创建填写信息等，表单中的控件通过不同标签不同元素实现，<form>中最为主要的属性有action，其值一般为后端所提供的，是表单数据提交到后端的核心，还有method(提交方法)，其值有get(默认)与post，get相对于post是不安全的，因为此方法会将信息暴露在浏览器中。

input基本使用

表单中最为主要实现控件的标签为<input>，通过属性type不同值实现不同的控件效果，其中type的值有text输入正常显示，password输入密码隐藏显示，radio单选框，checkbox复选框，file上传文件，reset重置按钮，submit提交按钮，button正常的按钮。

input中占位符

占位用属性placehoder，其值提示用户应该输入什么信息，占位符实现的功能是提示用户该位置输入什么内容，在用户输入内容后提示自动消失。

radio中单选使用以及默认选项

在我们想实现单选的目的后会发现radio的实现不能和我们想的一样，还是可以把所有框都选上，主要是因为电脑不知道我们需要把那几个框列为一组来做单选，那我们想就解决该问题就需要在同类的<input>标签中填入相同的name。

默认选中用属性checked,其属性值可以写checked也可以不写，checked在checkbox中同样使用。

file中多选文件

多选文件使用属性multiple实现,其属性值可以写mutiple也可以不写.若不加该元素，控件只允许上传一个文件。

button标签

submit只能提交，reset只能重置，button可以搭配js实现更多功能。

下拉菜单标签

下拉菜单用<select>标签表示,其中每一个选项用<option>标签标识，默认选项在<option>标签中使用属性selected,其属性值可以写selected也可以不写，<option>标签中属性value的值代表着我们传给后端的数据，元素值是我们展示给用户的，例如在用户界面我们想使用中文，而数据传输到后端时需要英文就可以将value的值使用中文对应的英文，元素值使用正常的中文。

文本域标签

文本域用<textarea>标签表示，其属性主要有row和col，其中cols的值表示文本域宽度，rows的值表示文本域高度，文本域可以拖拽右下角改变大小(可以通过设置不允许用户该表大小，这个很重要，后续讲解)，文本域主要用于用户填写长文本之类的，例如自我介绍等等。

lable标签

使用<lable>标签包裹时鼠标点击文字单选框也会选上，可以通过<lable>包住文字和控件实现<lable><input type="radio">女</lable>，还可以通过for和id实现<lable for="sex">女</lable><input type="radio" id=sex>。

以上内容不是全部表单内容(大部分已经有了这些基本也够用了)，其他的控件例如进度条之类的感兴趣的可以自行上网学习~~~