html表单有哪些标记
时间:2021-06-11
来源:互联网
今天PHP爱好者给大家带来html表单标记:“<form>”、“<input>”、“<textarea>”、“<label>”、“<fieldset>”、“<legend>”、“<select>”、“<option>”、“<button>”、“<output>”等。希望对大家有所帮助。
本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。
HTML 表单用于收集不同类型的用户输入。表单元素指的是不同类型的 input 元素、复选框、单选按钮、提交按钮等等。
html表单的标记:
<form> | 定义供用户输入的表单 |
<input> | 定义输入域 |
<textarea> | 定义文本域 (一个多行的输入控件) |
<label> | 定义了 <input> 元素的标签,一般为输入标题 |
<fieldset> | 定义了一组相关的表单元素,并使用外框包含起来 |
<legend> | 定义了 <fieldset> 元素的标题 |
<select> | 定义了下拉选项列表 |
<optgroup> | 定义选项组 |
<option> | 定义下拉列表中的选项 |
<button> | 定义一个点击按钮 |
<datalist> | 指定一个预先定义的输入控件选项列表 |
<keygen> | 定义了表单的密钥对生成器字段 |
<output> | 定义一个计算结果 |
扩展资料:<input> 元素
<input> 元素是最重要的表单元素。
<input> 元素有很多形态,根据不同的 type 属性。
1、文本域(Text Fields)
文本域通过<input type="text"> 标签来设定,当用户要在表单中键入字母、数字等内容时,就会用到文本域。
<form>
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>
浏览器显示如下:
注意:表单本身并不可见。同时,在大多数浏览器中,文本域的默认宽度是 20 个字符。
2、密码字段
密码字段通过标签<input type="password"> 来定义:
<form>
Password: <input type="password" name="pwd">
</form>
浏览器显示效果如下:
注意:密码字段字符不会明文显示,而是以星号或圆点替代。
3、单选按钮(Radio Buttons)
<input type="radio"> 标签定义了表单单选框选项
<form>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>
浏览器显示效果如下:
4、复选框(Checkboxes)
<input type="checkbox"> 定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项。
<form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>
浏览器显示效果如下:
5、提交按钮(Submit Button)
<input type="submit"> 定义了提交按钮.
当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。:
<form name="input" action="html_form_action.php" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>
浏览器显示效果如下:
假如您在上面的文本框内键入几个字母,然后点击确认按钮,那么输入数据会传送到 "html_form_action.php" 的页面。该页面将显示出输入的结果。
以上就是html表单有哪些标记的详细内容,更多请关注php爱好者其它相关文章!
-
币安APP怎么添加指纹解锁?-安全设置详细教程 时间:2025-05-14
-
《我的相册里一半是自拍,一半是风景(假装在旅游)》 时间:2025-05-14
-
币安如何参与链上投票?-治理代币投票流程解析 时间:2025-05-14
-
币安稳定币有哪些?-支持的稳定币种与用途分析 时间:2025-05-14
-
《“我今天不生气”——然后就被一句话破防了》 时间:2025-05-14
-
币安怎么创建子账户?-子账号开通与权限设置指南 时间:2025-05-14
今日更新
-
Word2019怎么插入视频?Word2019插入视频教程
阅读:18
-
word2019怎么添加脚注?word2019添加脚注教程
阅读:18
-
Word2019怎么开启学习工具?Word2019学习工具打开教程
阅读:18
-
Word2019怎么启用改写模式?Word2019改写模式设置教程
阅读:18
-
如何在win7安装office2019 完美安装图文教程(亲测可用)
阅读:18
-
怎么使用web/phpstorm将本地代码实时自动同步到远程服务器
阅读:18
-
html如何设置单元格颜色
阅读:18
-
css3怎么将滚动条隐藏
阅读:18
-
如何使用java去除html标签
阅读:18
-
html怎么设置水平线与文字的距离
阅读:18