基本语法
<------Form Basic------->
表单的基本语法
<form action="url" method=*>
...
...
<input type=submit> <input type=reset>
</form>
*=GET, POST
<------Input Basic------->
表单中提供给用户的输入形式
<input type=* name=**>
*=text, password, checkbox, radio, image, hidden, submit, reset
**=Symbolic Name for CGI script
<--################## Text & Passwd ########################-->
文字输入和密码输入
<------Text & Password------->*=text, password
<input type=*>
<input type=* value=**>
<form action=/cgi-bin/post-query method=POST>您的姓名: <input type=text name=姓名><br>您的主页的网址: <input type=text name=网址 value=http://><br>密码: <input type=password name=密码><br><input type=submit value="发送"><input type=reset value="重设"></form>
您的姓名:
您的主页的网址:
密码:
<------Text & Password -- Size, Max ------->
<input type=* size=**>
<input type=* maxlength=**>
<form action=/cgi-bin/post-query method=POST><input type=text name=a01 size=40><br><input type=text name=a02 maxlength=5><br><input type=submit><input type=reset></form>
<--################## Checkbox & Radio ########################-->
复选框(Checkbox) 和 单选框(RadioButton)
<------Checkbox------->
<input type=checkbox>
<input type=checkbox checked>
<input type=checkbox value=**>
<form action=/cgi-bin/post-query method=POST><input type=checkbox name=水果1> Banana<p><input type=checkbox name=水果2 checked> Apple<p><input type=checkbox name=水果3 value=橘子> Orange<p><input type=submit><input type=reset></form>
Banana
Apple
Orange
<------Checkbox------->
<input type=radio value=**>
<input type=radio value=** checked>
<form action=/cgi-bin/post-query method=POST><input type=radio name=水果> Banana<p><input type=radio name=水果 checked> Apple<p><input type=radio name=水果 value=橘子> Orange<p><input type=submit><input type=reset></form>
Banana
Apple
Orange
<--################## Image ########################-->
图象坐标
在下面选则一个系数后,在图象上点一下,就知道什么是图象坐标了!
<input type=image src=url>
<form action=/cgi-bin/post-query method=POST><input type=image name=face src=http://www.cncms.com.cn/html/f.gif><p><input type=radio name=zoom value=2 checked>x2<input type=radio name=zoom value=4>x4<input type=radio name=zoom value=6>x6<p><input type=reset></form>
x2 x4 x6
<--################## Hidden ########################-->
隐藏表单的元素
<input type=hidden value=*>
<form action=/cgi-bin/post-query method=POST><input type=hidden name=add value=hoge@hoge.jp>Here is a hidden element. <p><input type=submit><input type=reset></form>
Here is a hidden element.
<--################## Select ########################-->
列表框(Selectable Menu)
<------Basic------->
基本语法
<select name=*>
<option> ...
</select>
<------select & option------->
<option selected>
<option value=**>
<form action=/cgi-bin/post-query method=POST><select name=fruits> <option>Banana <option selected>Apple <option value=My_Favorite>Orange</select><p><input type=submit><input type=reset></form>
BananaAppleOrange
<------size & multiple------->
<select size=**>
<form action=/cgi-bin/post-query method=POST><select name=fruits size=3> <option>Banana <option selected>Apple <option value=My_Favorite>Orange <option>Peach</select><p><input type=submit><input type=reset></form>
BananaAppleOrangePeach
<------multiple------->
<select size=** multiple>
注意,是用 Ctrl 键配合鼠标实现多选。
(和 MS-WINDOWS 的 File Manager 一样)
<form action=/cgi-bin/post-query method=POST><select name=fruits size=3 multiple> <option selected>Banana <option selected>Apple <option value=My_Favorite>Orange <option selected>Peach</select><p><input type=submit><input type=reset></form>
BananaAppleOrangePeach
<--################## Textarea ########################-->
文本区域
<textarea name=* rows=** cols=**> ... <textarea>
<form action=/cgi-bin/post-query method=POST><textarea name=comment rows=5 cols=60></textarea><P><input type=submit><input type=reset></form>
<------Word Wrapping Off------->
对于很长的行是否进行换行的设置(Word Wrapping)
<textarea wrap=off> ... </textarea>
- 不换行,是缺省设置。
<------Word Wrapping Soft------->
<textarea wrap=soft> ... </textarea>
“软换行”,好象 MS-WORD 里的“软回车”。
- <form action=/cgi-bin/post-query method=POST>
<textarea wrap=soft name=comment rows=5 cols=25> </textarea><P>
<input type=submit><input type=reset>
</form>
<------Word Wrapping Hard------->
<textarea wrap=hard> ... </textarea>
“硬换行”,好象 MS-WORD 里的“硬回车”。
- <form action=/cgi-bin/post-query method=POST>
<textarea wrap=hard name=comment rows=5 cols=25> </textarea><P>
<input type=submit><input type=reset>
</form>
以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索密码
, 表单
, 输入
, 语法
, apple
图象
html5 form表单 模板、html form表单、html5 form表单、html form表单提交、html获取form表单数据,以便于您获取更多的相关知识。