定义文本域
<html>
<body>
<form>
姓：
<input type="text" name="firstname">
<br/>
名：
<input type="text" name="lastname">
</form>
</body>
</html>
定义密码域
<html>
<body>
<form>
姓：
<input type="text" name="firstname">
<br/>
名：
<input type="text" name="lastname">
<br/>
密码：
<input type="password" name="password">
</form>
</body>
</html>
表单
表单是一个包含表单元素的区域
表单元素是允许用户在表单中(比如：文本域、下拉列表、单选框、复选框等)输入信息的元素。
表单使用表单标签<form>定义
多数情况下呗用到的表单标签是输入标签<input>。输入类型是由类型属性type定义的。注意：表单本身是不可见的，大多数浏览器，文本域的缺省宽度是20个字符。
单选按钮radio
<input type="radio" name="sex" value="male">male
表单的动作属性(action)和确认按钮
<form name="input" action="html_form_action.asp" method="get"> Username: <input type="text" name="user" /> <input type="submit" value="Submit" /> </form>
加入在文本框输入几个字母，点击确认按钮，输入数据会传送到html_form_action.asp的页面，该页面将会显示输入的结果。
复选框：checkbox
下拉列表
<html> <body> <form> <!定义一个选择列表> <select name="cars"> <!option定义下拉列表的选项> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat">Fiat</option> <option value="audi">Audi</option> </select> </form> </body> </html>
创建一个带有预选值的下拉列表，使用option标签下的selected属性
<html> <body> <form> <select name="cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat" selected="selected">Fiat</option> <option value="audi">Audi</option> </select> </form> </body> </html>
通过使用textarea标签创建多行的文本输入控件
<html> <body> <p> This example cannot be edited because our editor uses a textarea for input, and your browser does not allow a textarea inside a textarea. </p> <textarea rows="10" cols="30"> The cat was playing in the garden.
在数据周围绘制一个带标题的框
<!DOCTYPE HTML>
<html>
<body>
<form>
<fieldset>
<legend>健康信息</legend>
身高：<input type="text" />
体重：<input type="text" />
</fieldset>
</form>
<p>如果表单周围没有边框，说明您的浏览器太老了。</p>
</body>
</html>
在表单中发送电子邮件
<html> <body> <form action="MAILTO:[email protected]" method="post" enctype="text/plain"> <h3>这个表单会把电子邮件发送到 W3School。</h3> 姓名：<br /> <input type="text" name="name" value="yourname" size="20"> <br /> 电邮：<br /> <input type="text" name="mail" value="yourmail" size="20"> <br /> 内容：<br /> <input type="text" name="comment" value="yourcomment" size="40"> <br /><br /> <input type="submit" value="发送"> <input type="reset" value="重置"> </form> </body> </html>
时间： 2024-11-06 09:26:28