您的位置:首页 > Web前端 > HTML

HTML表单

2017-12-31 21:45 211 查看
表单

语法:

<form>

表单元素

</form>

其中,表单元素,可以是:文本域.、单选框、复选框、按钮、列表。

表单本身不可见,网页上显示出来的是表单元素。







示例:

<!DOCTYPE html>
<html>
<head>
<title>基础表单</title>
<meta charset="utf-8">
</head>
<body>
<form>
姓名:<input type="text" name="username">
密码:<input type="password" name="paw">
<input type="submit">
</form>

</body>
</html>






示例:

<!DOCTYPE html>
<html>
<head>
<title>表单元素</title>
<meta charset="utf-8">
</head>
<body>

<h1 align="center">注册信息</h1>
<hr color="#000000">

<form>
<table width="600px" align="center" bgcolor="#f2f2f2">

<tr >
<td>姓名:</td>
<td><input type="text" name="username" size="25" maxlength="6" placeholder="请输入姓名"></td>
</tr>

<tr >
<td>邮箱:</td>
<td><input type="text" name="email" size="25" value="@163.com" ></td>
</tr>

<tr >
<td>密码:</td>
<td><input type="password" name="pwd" size="25"></td>
</tr>

<tr >
<td>确认密码:</td>
<td><input type="password" name="pwd" size="25"></td>
</tr>

<tr >
<td>上传照片</td>
<td><input type="file" name="userimg"></td>
</tr>

<tr >
<td>性别:</td>
<td>男<input type="radio" name="gender" value="man">
女<input type="radio" name="gender" value="woman">
保密<input type="radio" name="gender" value="bm" checked>
</td>
</tr>

<tr >
<td>爱好:</td>
<td>读书<input type="checkbox" name="dx1" value="read" checked>
跳舞<input type="checkbox" name="dx1" value="dance">
唱歌<input type="checkbox" name="dx1" value="sing">
</td>
</tr>

<tr >
<td><input type="button" name="button" value="点我">
<input type="submit" name="submit">
<input type="reset" name="reset"></td>
<input type="image" name="image_button" src="img">
<input type="hidden" name="hidden" value="这是一个用户注册信息">
<td></td>
</tr>
</table>
</form>
</body>
</html>










<table>
<tr>
<td>城市:</td>
<td><!--下拉菜单-->
<select name="city">
<option value=“default”>--请选择--</option>
<option value="bj" selected>北京</option><!--默认选中-->
<option value="sh">上海</option>
<option value="tj">天津</option>
<option value="cq">重庆</option>
</select>
</td>
<td><!--列表项-->
<select name="city" size="2" multiple>
<option value="bj">北京</option>
<option value="sh">上海</option>
<option value="tj">天津</option>
<option value="cq">重庆</option>
</select>
</td>
</tr>
</table>




<body>
<table>
<tr>
<td>城市:</td>
<td><!--下拉菜单-->
<select name="city">
<option value=“default”>--请选择--</option>
<optgroup label="北">
<option value="bj" selected>北京</option><!--默认选中-->
<option value="sh">上海</option>
<option value="tj">天津</option>
</optgroup>
<optgroup label="南">
<option value="cq">重庆</option>
<option value="sh">上海</option>
<option value="tj">天津</option>
<option value="cq">重庆</option>
<option value="sh">上海</option>
<option value="tj">天津</option>
<option value="cq">重庆</option>
</optgroup>
</select>
</td>
<td><!--列表项-->
<select name="city" size="2" multiple>
<option value="bj">北京</option>
<option value="sh">上海</option>
<option value="tj">天津</option>
<option value="cq">重庆</option>
</select>
</td>
</tr>
</table>






<td>简介</td>
<td>
<textarea name="intro" rows="6" cols="50" placeholder="请输入个人介绍"></textarea>
</td>






内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  html 表单