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

认识html标签(第二部分）

2016-09-28 09:27 225 查看

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表单标签</title>

<body>
<!--使用表单标签，与用户交互-->
<form method="post" action="save.php">
<label>用户名:</label>
<!--文本框-->
<input type="text" name="username" value="" />
<br />
<br />
<label>密码:    </label>
<!--密码框-->
<input type="password" name="pass" value="" />
<br />
<br />
<label>           </label>
<!--提交按钮-->
<input type="submit" value="提交" />
<!--重置按钮-->
<input type="reset" value="重置" />
<hr />
<br />
<br />
<label>请在这里输入你的个人经历:</label>
<br />
<br />
<!--多行文本框输入-->
<textarea rows="20" cols="40"></textarea>
<br />
<br />
<input type="submit" value="提交" />
<input type="reset" value="重置" /><hr /><br /><br />
<label>你最喜欢下列哪种水果(单选）：</label><br />
<!--单选框-->
<input type="radio" value="苹果"  name="checkbox1" />苹果
<input type="radio" value="荔枝"  name="checkbox1" />荔枝
<input type="radio" value="香蕉"  name="checkbox1"/>香蕉
<input type="radio" value="橘子"  name="checkbox1"/>橘子<br /><br />
<label>你喜欢下列哪几种运动(多选）：</label><br />
<!--复选框-->
<input type="checkbox" value="跑步"  name="checkbox1" />跑步
<input type="checkbox" value="游泳"  name="checkbox1" />游泳
<input type="checkbox" value="爬山"  name="checkbox1"/>爬山
<input type="checkbox" value="步行"  name="checkbox1"/>步行<br /><br />
<input type="submit" value="提交" /><br /><br />
<hr />
<label>爱好:</label>
<!--下拉列表标签-->
<select>
<option value="看书" select="select">看书</option>
<option value="淘宝" >淘宝</option>
<option value="逛街" >逛街</option>
<option value="旅游" >旅游</option>
</select>
<hr />
<br /><br /><br />
<!--滚动条标签-->
<label>爱好:</label>
<select multiple="multiple">
<option value="看书" >看书</option>
<option value="淘宝" >淘宝</option>
<option value="逛街" >逛街</option>
<option value="旅游" >旅游</option>
<option value="游泳" >旅游</option>
</select>

</form>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航