HTML表单_输入元素

  • 大多数情况被用到的表单标签是输入标签
  • 输入类型是由类型属性（type）定义的。

常用的表单元素类型如下：

文本域（Test Fields）

文本域通过 标签来设定，当用户要在表单中键入字母、数字等内容时，就会用到文本域。 文本域为只有一行的文本框，效果如下：

<form>
account_ : <input type="text" name="firstname"><br>
password: <input type="password" name="lastname">
</form>

account_ :
password:

  • 可以通过将input type的值改为password来讲文本域改为密码字段专用（即输入不可见 **或···）

文本框

<textarea rows="4" cols="30">
我是一个文本框。rows为行数，cols为列数
</textarea>

按钮

<form action="">
<input type="button" value="This is a button">这个按钮下什么都没有
</form>

这个按钮下什么都没有

单选按钮和复选框（Radio Buttons ,ChackBoxes）

<input type="radio">

<input type="checkbox">

<form>
<input type="radio" name="sex" value="male">Male
<input type="radio" name="sex" value="female">Female<br>
<input type="checkbox" name="vehicle" value="Bike">I have a bike
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>

Male
Female

I have a bike
I have a car

  • 同一个name属性的单选框为一组（一组只能选中一个）
  • value或许是按钮的返回值，瞎猜就完事

select选择列表

<form action="">
<select name="cars">
<option value="null">请选择性别</option>
<option value="1">男</option>
<option value="2">女</option>
<option value="3" selected>不详</option>
</select>
</form>

请选择性别
男
女
不详

  • 无需多余解释，代码即可
  • 可在option标签中 添加selected元素即为预选项，如没有，则默认为第一个option

提交按钮(Submit Button)

<input type="submit">定义了提交按钮.

顾名思义，提取表单中的数据到某处

  • 当用户单击确认按钮时，表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。

表单

在表单周围添加边框

<form>
<fieldset>
<legend>边框上的文字:</legend>
account_ : <input type="text" name="firstname"><br>
password: <input type="password" name="lastname">
</fieldset>
</form>
边框上的文字:

account_ :
password:

版权声明：本文为jumpywin原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://www.cnblogs.com/jumpywin/p/11926843.html