例4.2 在普通网页中插入表单操作步骤如下:
①建立HMTL文档,命名为index.php文件。
②在文件中添加代码如下:
<!DOCTYPE html>
<head>
<title> New Document </title>
<meta name="Generator" content="Edit Plus"><meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<meta charset="utf-8">
<style type="text/css">
div{ width:35%;margin-left:32%;}
</style>
</head>
<body >
<div>
<form class="form1" action="#" method="get">
<fieldset >
<legend>表单的注册</legend>
<table width=100%>
<tbody>
<tr >
<td class="left" width=40% align="right">
<label for="t1">姓名:</label>
</td>
<td class="right">
<input type="text" id="t1" name="Name">
</td>
</tr>
<tr>
<td class="left" width=40% align="right">
<label for="Password1">密码:</label>
</td>
<td class="right">
<input id="Password1" type="password" name="Password"/>
</td>
</tr>
<tr>
<td class="left" width=40% align="right">
<label for="e1">邮箱:</label>
</td>
<td class="right">
<input type="email" id="e1" name="youxiang">
</td>
</tr>
<tr>
<td class="left" width=40% align="right">
<label for="1">性别:</label>
</td>
<td class="right"><!-- name设置成一样的就行了-->
<input type="radio" id="1" name="ssex" value="nan"/>男
<input type="radio" id="2" name="ssex" value="nv"/>女
</td>
</tr>
<tr>
<td class="left" width=40% align="right">地区:</td>
<td>
<select id="selc" name="place">
<option value="wuhan">武汉</option>
<option value="xiamen">厦门</option>
<option value="zhangzhou">漳州</option>
</select>
</td>
</tr>
<tr>
<td class="left" width=40% align="right">
<label for="txtarea">简介:</label>
</td>
<td>
<textarea id="txtarea"></textarea>
</td>
</tr>
<tr>
<td class="left" width=40% align="right">兴趣:</td>
<td>
<input type="checkbox" id="cbox1" name="dushu"
value="c1">读书
<input type="checkbox" id="cbox2" name="yundong"
value="c2">运动
<input type="checkbox" id="cbox3"name="chihe"
value="c3">吃喝
</td>
</tr>
<tr><td class="left" width=40% align="right">上传:</td>
<td>
<input type="file" id="f1" name="shangchuan" value="File1"/>
</td>
</tr>
<tr>
<td class="left" width=40% align="right" rowspan=2>
<input id="Submit1" type="submit" value="提交"/>
</td>
<td>
<input id="Reset1" type="reset" value="重置"/>
</td>
</tr>
</tbody>
</table>
</fieldset>
</form>
</div>
</body>
</html>
③代码在浏览器中运行结果如图4.1所示。
图4.1
免责声明:以上内容源自网络,版权归原作者所有,如有侵犯您的原创版权请告知,我们将尽快删除相关内容。