HTML5中form表单标签用法详解
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了HTML5中form表单标签用法详解，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含3093字，纯文字阅读大概需要5分钟。
内容图文
本文主要和大家分享HTML5中form表单标签用法详解，会以代码实例来和大家分享form的用法，希望能帮助到大家。语法： <form method = "传送方式" action = "服务器文件">
讲解：1.<form>是成对出现的， 以<form> 开始， 以 </form>结束,表单都必须放在其之间。
2.method 传送方式， get/post 是后端程序员考虑的问题
3.action 浏览者输入的数据被传送到的地方，比如一个php页面， (save.php)
<form method="post" action="save.php">
<label for="username">用户名:</label>
<input type="text" name="username" />
<label for="pass">密码:</label>
<input type="password" name="pass" />
</form>
文本输入框，密码输入框
当用户需要在表单中键入字母，数据等，就要用到文本输入框，文本输入框也可以转化为密码输入框
语法：
<form>
<input type = "text/password" name = "名称" value = "文本" />
</form>
讲解：1.type ：
当 type 为 text时，为文本输入框
当 type 为 password 时， 为密码输入框
2.name ：为文本框命名，以备后台asp php使用
3.value ：为文本输入框设置默认值（一般起提示作用）
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>文本输入框、密码输入框</title>
</head>
<body>
<form method="post" action="save.php">
账户:
<input type = "text" name = "myName" />
<br />
密码：
<input type = "password " name = "pass"/>
</form>
</body>
</html>
结果：
账户:
密码:
文本域：支持多行文本输入
当用户需要在表单中输入大段文字时，就要用到文本输入域
语法：
<textarea rows = "行数" cols = "列数" > 文本 </textarea>
讲解：1.文本输入域以 <textarea>开始 ，以 </textarea>结束
2.rows： 输入文本输入域的行数
3.cols ： 输入文本输入域的列数
4.在<textarea></textarea>标签之间输入默认值
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>文本域</title>
</head>
<body>
<form method = "post" action = "save.php">
<label>个人简介</label>
<textarea rows = "5" cols = "10">在这里输入内容...</textarea></span>
<input type = "submit" value = "确定" name = "submit" />
<input type = "reset" value = "重置" name = "reset" />
</form>
</body>
</html>
结果：
个人简介
<lable>在后面会有详解。
使用单选框，复选框让用户选择
在使用表单设计调查表时，为了减少用户的操作，使用选择框是一个好办法，在HTML中，有单选框和复选框，两者的主要区别是 单选框中用户的选项只能选择一项，而复选框中用户可以任意选择多项，甚至全选。
<input type = "radio/checkbox" value = "值" name = "名称" checked = "checked" />
讲解：
1. type : radio :控件单选框
checkbox : 控件复选框
2. value: 提供数据到服务器的值
3. name：为控件命名，以备后台程序ASP，PHP使用
4.checked： 当设置 checked = “checked”时，该选项被默认选中。
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>单选框、复选框</title>
</head>
<body>
<form name = "iForm" method = "post" action = "save.php">
你是否喜欢旅游？<br />
<input type = "radio" name = "radioLove" value = "喜欢" checked = "checked"/></span>
<input type = "radio" name = "radioLove" value = "不喜欢"/>
<input type = "radio" name = <span class="attribute
内容总结
以上是互联网集市为您收集整理的HTML5中form表单标签用法详解全部内容，希望文章能够帮你解决HTML5中form表单标签用法详解所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。