📄 html5.htm
字号:
<HTML><HEAD><META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb_2312-80"><META NAME="Generator" CONTENT="Microsoft Word 97"><TITLE>HTML语言教程之五：表单(FORM)标记</TITLE><META NAME="Template" CONTENT="C:\PROGRAM FILES\MICROSOFT OFFICE\OFFICE\html.dot"><link rel="stylesheet" href="../../cpcw.css"></HEAD><BODY LINK="#0000ff" VLINK="#800080" background="../bg.gif"><table width="85%" border="0" align="center"> <tr bgcolor="#FFFFFF"> <td> <p align="CENTER"><font size="6" lang="ZH-CN"><font color="#FF3333" class="title"><b>HTML语言教程之五：表单(FORM)标记</b></font></font></p> <p align="JUSTIFY"></p> <hr> <h1 align=left><!--################## Basic ########################--><a name="basic"></a></h1> <h2> 基本语法</h2> <p><!------Form Basic-------></p> <h3>表单的基本语法</h3> <dl> <h3><tt><form action="url" method=*><br> ... <br> ... <br> <input type=submit> <input type=reset><br> </form> </tt></h3> <p><tt>*=GET, POST </tt></p> </dl> <pre></pre> <p><!------Input Basic-------></p> <h3>表单中提供给用户的输入形式</h3> <dl> <h3><tt><input type=* name=**></tt></h3> <p><tt>*=text, password, checkbox, radio, image, hidden, submit, reset</tt></p> <p><tt> **=Symbolic Name for CGI script </tt></p> </dl> <pre></pre> <p><!--################## Text & Passwd ########################--><a name="text"></a></p> <h2> 文字输入和密码输入</h2> <p><!------Text & Password-------><tt>*=text, password</tt> </p> <h3><input type=*><br> <input type=* value=**></h3> <pre><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></pre> <p> <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="发送" name="submit"> <input type=reset value="重设" name="reset"> </form> <p></p> <pre></pre> <p><!------Text & Password -- Size, Max -------></p> <h3><input type=* size=**><br> <input type=* maxlength=**></h3> <pre><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></pre> <p> <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 name="submit"> <input type=reset name="reset"> </form> <p></p> <pre></pre> <p><!--################## Checkbox & Radio ########################--><a name="check"></a></p> <h2> 复选框(Checkbox) 和 单选框(RadioButton) </h2> <p><!------Checkbox-------></p> <h3><input type=checkbox><br> <input type=checkbox checked><br> <input type=checkbox value=**></h3> <pre><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></pre> <p> <form action=/cgi-bin/post-query method=POST> <input type=checkbox name=水果1> Banana <p></p> <p> <input type=checkbox name=水果2 checked> Apple</p> <p> <input type=checkbox name=水果3 value=橘子> Orange</p> <p> <input type=submit name="submit"> <input type=reset name="reset"> </form> <p></p> <pre></pre> <p><!------Checkbox-------></p> <h3><input type=radio value=**><br> <input type=radio value=** checked></h3> <pre><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></pre> <p> <form action=/cgi-bin/post-query method=POST> <input type=radio name=水果> Banana <p></p> <p> <input type=radio name=水果 checked> Apple</p> <p> <input type=radio name=水果 value=橘子> Orange</p> <p> <input type=submit name="submit"> <input type=reset name="reset"> </form> <p></p> <pre></pre> <p><!--################## Image ########################--><a name="image"></a></p> <h2> 图象坐标 </h2> <p> <b>在下面选则一个系数后，在图象上点一下，就知道什么是图象坐标了！</b> <h3><input type=image src=url></h3> <pre><form action=/cgi-bin/post-query method=POST><input type=image name=face src=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></pre> <p> <form action=/cgi-bin/post-query method=POST> <input type=image src=f.gif name=face> <p></p> <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> <p> <input type=reset name="reset"> </form> <p></p> <pre></pre> <p><!--################## Hidden ########################--><a name="hide"></a></p> <h2> 隐藏表单的元素 </h2> <h3><input type=hidden value=*></h3> <pre><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></pre> <p> <form action=/cgi-bin/post-query method=POST> <input type=hidden name=add value=hoge@hoge.jp> Here is a hidden element. <p></p> <p> <input type=submit name="submit"> <input type=reset name="reset"> </form> <p></p> <pre></pre> <p><!--################## Select ########################--><a name="select"></a></p> <h2> 列表框(Selectable Menu) </h2> <p><!------Basic-------></p> <h3>基本语法</h3> <dl> <h3><select name=*><br> <option> ...<br> </select> </h3> </dl> <p><!------select & option-------></p> <h3><option selected><br> <option value=**></h3> <pre><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></pre> <p> <form action=/cgi-bin/post-query method=POST> <select name=fruits> <option>Banana <option selected>Apple <option value=My_Favorite>Orange </select> <p></p> <p> <input type=submit name="submit"> <input type=reset name="reset"> </form> <p></p> <pre></pre> <p><!------size & multiple-------></p> <h3><select size=**></h3> <pre><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></pre> <p> <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></p> <p> <input type=submit name="submit"> <input type=reset name="reset"> </form> <p></p> <pre></pre> <p><!------multiple-------></p> <h3><select size=** multiple></h3> <b>注意，是用 Ctrl 键配合鼠标实现多选。<br> (和 MS-WINDOWS 的 File Manager 一样)</b> <pre><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></pre> <p> <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></p> <p> <input type=submit name="submit"> <input type=reset name="reset"> </form> <p></p> <pre></pre> <p><!--################## Textarea ########################--><a name="textarea"></a></p> <h2> 文本区域</h2> <h3><textarea name=* rows=** cols=**> ... <textarea></h3> <pre><form action=/cgi-bin/post-query method=POST><textarea name=comment rows=5 cols=60></textarea><P><input type=submit><input type=reset></form></pre> <p> <form action=/cgi-bin/post-query method=POST> <textarea name=comment rows=5 cols=60></textarea> <p></p> <p> <input type=submit name="submit"> <input type=reset name="reset"> </form> <p></p> <pre></pre> <p><!------Word Wrapping Off-------><a name="wrap"></a></p> <h3>对于很长的行是否进行换行的设置(Word Wrapping) <img src="netscape.gif" height=14 width=80></h3> <h3><textarea wrap=off> ... </textarea></h3> <dl> <dd>不换行，是缺省设置。</dd> </dl> <p><!------Word Wrapping Soft-------></p> <h3><textarea wrap=soft> ... </textarea></h3> “软换行”，好象 MS－WORD 里的“软回车”。 <dl> <dd><tt><form action=/cgi-bin/post-query method=POST><br> <textarea wrap=soft name=comment rows=5 cols=25> </textarea><P><br> <input type=submit><input type=reset><br> </form></tt><br> </dd> </dl> <p> <form action=/cgi-bin/post-query method=POST> <textarea wrap=soft name=comment rows=5 cols=25></textarea> <p></p> <p> <input type=submit name="submit"> <input type=reset name="reset"> </form> <p></p> <p><!------Word Wrapping Hard-------></p> <h3><textarea wrap=hard> ... </textarea></h3> “硬换行”，好象 MS－WORD 里的“硬回车”。 <dl> <dd><tt><form action=/cgi-bin/post-query method=POST><br> <textarea wrap=hard name=comment rows=5 cols=25> </textarea><P><br> <input type=submit><input type=reset><br> </form></tt><br> </dd> </dl> <p> <form action=/cgi-bin/post-query method=POST> <textarea wrap=hard name=comment rows=5 cols=25></textarea> <p></p> <p> <input type=submit name="submit"> <input type=reset name="reset"> </form> <p></p> <pre></pre> <p><!--################## (^^) Jump & Add (^^) ########################--> <p><blink> </blink></p> <p align="CENTER"><a href="../homepage.htm"><font face="宋体" lang="ZH-CN">返回主页</font></a> <a href="html4.htm">上一节</a> <a href="html6.htm">下一节</a></p> <font face="宋体" lang="ZH-CN"><p align="CENTER"><a href="http://www.cpcw.com">电脑报首页</a> <a href="../index.htm">网络学院首页</a></p> </font></td> </tr></table></BODY></HTML>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -