今天小编跟大家讲解下有关HTML Form表单元素全面了解 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关HTML Form表单元素全面了解 的相关资料，希望小伙伴们看了有所帮助。
如下所示：
XML/HTML Code复制内容到剪贴板 <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <title>注册表单</title> </head> <body> <formaction="DoFormAction.htm"> <fieldsetstyle="width=800px"><!--套住注册表格的边框--> <legend>请输入如下的信息然后进行注册</legend> <tablecellspacing="0px"cellpadding="6px"border="1px"bordercolor="black"align="center"width="600px"> <tr> <tdalign="right">用户名:</td><!--文本框--> <td><inputtype="text"size="20"style="width:150px"/></td> </tr> <tr> <tdalign="right">密码:</td><!--密码框--> <td><inputtype="password"size="20"style="width:150px"/></td> </tr> <tr> <tdalign="right">确认密码:</td> <td><inputtype="password"size="20"style="width:150px"/></td> </tr> <tr> <tdalign="right">性别:</td><!--单选框--> <td> <inputtype="radio"checked="checked"name="sex1"value="男"/>男 <inputtype="radio"name="sex1"value="女"/>女 </td> </tr> <tr> <tdalign="right">性别(可以点文字选择):</td> <td> <fieldsetstyle="width:150px"><!--表单外框，也可以通过css设置宽度--> <legend>请选择性别</legend> <inputtype="radio"checked="checked"name="sex2"value="男"id="man"/> <labelfor="man">男</label> <inputtype="radio"name="sex2"value="女"id="woman"/> <labelfor="woman">女</label> </fieldset> </td> </tr> <tr> <tdalign="right">城市:</td><!--下拉框--> <td> <selectname="city"> <optionvalue="北京">北京</option> <optionvalue="深圳">深圳</option> <optionvalue="上海">上海</option> <optionvalue="南昌"selected="selected">南昌</option><!--默认选择南昌--> </select> </td> </tr> <tr> <tdalign="right">城市所在区域:</td> <td> <selectname="area"> <optgrouplabel="北京"><!--下拉框分组显示--> <optionvalue="朝阳区">朝阳区</option> <optionvalue="海淀区">海淀区</option> <optionvalue="其他区">其他区</option> </optgroup> <optgrouplabel="南昌"> <optionvalue="东湖区">东湖区</option> <optionvalue="西湖区">西湖区</option> <optionvalue="青山湖区">青山湖区</option> </optgroup> </select> </td> </tr> <tr> <tdalign="right">交友目标:</td> <td> <selectname="target"size="3"multiple="multiple"><!--列表框--> <optionvalue="同行"selected="selected">同行</option> <optionvalue="普通朋友">普通朋友</option> <optionvalue="爱人">爱人</option> </select> </td> </tr> <tr> <tdalign="right">爱好:</td> <td> <!--复选框,注意name属性设置一样，分组--> <inputtype="checkbox"name="love"value="足球"/>足球 <inputtype="checkbox"name="love"value="蓝球"/>蓝球 <inputtype="checkbox"name="love"value="乒乓球"/>乒乓球 </td> </tr> <tr> <tdalign="right">照片上传:</td> <td> <!--文件选择框--> <inputtype="file"name="myPic"/> </td> </tr> <tr> <tdalign="right">自我介绍:</td> <td> <!--多行文本框--> <textarearows="5"cols="50"> </textarea> </td> </tr> <tr> <tdalign="center"colspan="2"> <inputtype="submit"value="确定"/> <inputtype="reset"value="清空"/> <inputtype="image"src=http://www.ztc188.com/skin/7ke/image/nopic.gif>nclick="alert('hello')"/><!--演示图片按钮(会提交数据，类似submit) --> </td> </tr> </table> </fieldset> </form> </body> </html>以上就是小编为大家带来的HTML Form表单元素全面了解的全部内容了，希望对大家有所帮助，多多支持爱蒂网~
来源：爱蒂网
