html精简总结--表单

简介:
文字输入表单
呈现结果 姓名:
原始码 <FORM>
姓名:<INPUT TYPE="TEXT" NAME="NAME" SIZE="20">
</FORM>
其有下列可设定之属性:
NAME="名称",是设定此一字段的名称,程序中常会用到。 
SIZE="数值",是设定此一字段显现的宽度。 
VALUE="预设内容",是设定此一字段的预设内容。 
ALIGN="对齐方式",是设定此一字段的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、 RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置 中)、ABSBOTTOM(绝对置下)等。 
MAXLENGTH="数值",是设定此一字段可设定输入的最大长度。
 
单选核取表单:利用TYPE="RADIO"就会产生单选核取表单,单选核取表单通常是好几个选项一起摆出来供使用者点选,一次只能从中选一个,故为单选核取表单。
 
呈现结果 性別:男 女 
原始码 <FORM>
性別:
男 <INPUT TYPE="RADIO" NAME="SEX" VALUE="BOY">
女 <INPUT TYPE="RADIO" NAME="SEX" VALUE="GIRL">
</FORM>
其有下列可设定之属性:
NAME="名称",是设定此一字段的名称,程序中常会用到。 
VALUE="内容",是设定此一字段的内容、值或是意义。 
ALIGN="对齐方式",是设定此一字段的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、 RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置 中)、ABSBOTTOM(绝对置下)等。 
CHECKED,是设定此一字段为预设选取值。
复选核取表单:利用TYPE="  CHECKBOX "就会产生复选核取表单,复选核取表单通常是好几个选项一起摆出来供使用者点选,一次可以同时选好几个,故为复选核取表单。 
 
呈现结果 喜好:电影看书
原始码 <FORM>
喜好:
<INPUT TYPE="CHECKBOX" NAME="SEX" VALUE="MOVIE">电影
<INPUT TYPE="CHECKBOX" NAME="SEX" VALUE="BOOK">看书
</FORM>
其有下列可设定之属性:
NAME="名称",是设定此一字段的名称,程序中常会用到。 
VALUE="内容",是设定此一字段的内容、值或是意义。 
ALIGN="对齐方式",是设定此一字段的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、 RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置 中)、ABSBOTTOM(绝对置下)等。 
CHECKED,是设定此一字段为预设选取值。
密码窗体:利用TYPE="  PASSWORD "就会产生一个密码窗体,密码窗体和文字输入窗体长得几乎一样,差别就在于密码窗体在输入时全部会以星号来取代输入的文字,以防他人偷窥。
呈现结果 请输入密码:
原始码 <FORM>
请输入密码:<INPUT TYPE="PASSWORD" NAME="INPUT">
</FORM>
 其有下列可设定之属性:
NAME="名称",是设定此一字段的名称,程序中常会用到。 
SIZE="数值",是设定此一字段显现的宽度。 
VALUE="预设内容",是设定此一字段的预设内容,不过呈现出来仍是星号。 
ALIGN="对齐方式",是设定此一字段的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、 RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置 中)、ABSBOTTOM(绝对置下)等。 
MAXLENGTH="数值",是设定此一字段可设定输入的最大长度。
送出按钮:通常我们窗体填完之后,都会有一个送出按钮以及清除重写的按钮,分别是利用TYPE="  SUBMIT "及TYPE="  RESET "来产生,相当的简单易用。
 
呈现结果
原始码 <FORM>
<INPUT TYPE="SUBMIT" VALUE="送出资料">
<INPUT TYPE="RESET" VALUE="重新填写">
</FORM>
其有下列可设定之属性:
NAME="名称",是设定此一按钮的名称。 
VALUE="文字",是设定此一按钮上要呈现的文字,若是没有设定,浏览器也会自动替您加上「送出查询」、「重设」等字样。 
ALIGN="对齐方式",是设定此一字段的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、 RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置 中)、ABSBOTTOM(绝对置下)等。 
按钮组件:窗体中或是JAVA SCRIPT常会用到按钮来作一些效果,因此,我们可以利用TYPE=" BUTTON "来产生一个按钮,相当简单。 
 
呈现结果 请按下按钮:
原始码 <FORM>
请按下按钮:<INPUT TYPE="BUTTON" NAME="OK" VALUE="我同意">
</FORM>
其有下列可设定之属性:
NAME="名称",是设定此一按钮的名称。 
VALUE="文字",是设定此一按钮上要呈现的文字。 
ALIGN="对齐方式",是设定此一字段的对齐方式,其值有:TOP(向上对齐)、MIDDLE(向中对齐)、BOTTOM(向下对齐)、 RIGHT(向右对齐)、LEFT(向左对齐)、TEXTTOP(向文字顶部对齐)、BASELINE(向文字底部对齐)、ABSMIDDLE(绝对置 中)、ABSBOTTOM(绝对置下)等。



本文转自 xhinkerx 51CTO博客,原文链接:http://blog.51cto.com/xhinker/134403,如需转载请自行联系原作者
目录
相关文章
|
4月前
|
存储 移动开发 JavaScript
HTML5中form表单防止重复提交的两种方法
HTML5中form表单防止重复提交的两种方法
|
4月前
|
数据安全/隐私保护 UED
HTML表单
HTML表单
37 1
|
1月前
|
前端开发
HTML+CSS基础知识(6)背景的设置、表格的设计、表单的设计和框架集
这篇文章详细介绍了如何在HTML和CSS中设置背景、设计表格、创建表单以及使用框架集,并通过代码示例和测试结果展示了具体的实现方法和效果。
HTML+CSS基础知识(6)背景的设置、表格的设计、表单的设计和框架集
|
20天前
|
移动开发 数据安全/隐私保护 UED
HTML表单标签详解:如何用HTML标签打造互动网页?
通过合理使用HTML表单标签,可以构建功能丰富、用户友好的互动网页。HTML表单的元素和属性提供了丰富的输入选项和验证功能,使得收集和处理用户输入成为可能。随着HTML5的发展,表单元素的功能性和用户体验将继续得到提升。开发者应充分利用这些工具,为用户打造流畅、互动性强的网页体验。
31 4
|
26天前
|
前端开发
酷炫表单,触感未来:HTML与CSS动画的创新应用!
酷炫表单,触感未来:HTML与CSS动画的创新应用!
|
3月前
|
Web App开发 前端开发 Java
基于Spring3 MVC实现基于HTML form表单文件上传
基于Spring3 MVC实现基于HTML form表单文件上传
40 7
基于Spring3 MVC实现基于HTML form表单文件上传
|
3月前
|
数据采集 JavaScript 前端开发
HTML表单深度解析:构建互动的网页界面
HTML表单深度解析:构建互动的网页界面
|
3月前
|
Python
HTML表单
【6月更文挑战第13天】HTML表单。
28 7
|
2月前
|
数据安全/隐私保护
HTML4(三):表单
HTML4(三):表单
20 0