HTML总结（2）

最新推荐文章于 2024-03-18 12:09:27 发布

HarveyHarveyHarvey

最新推荐文章于 2024-03-18 12:09:27 发布

阅读量349

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/wanghuawei19930812/article/details/74075361

版权

前端专栏收录该内容

9 篇文章 0 订阅

订阅专栏

表单的创建：

<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>表单的例子</title>
	</head>
	<body>
		<form method="get" action="http://baike.baidu.com/item/meta">
			用户名：<input type="text" name="user" value="游客" size="30"><br>
			密　码：<input type="password" name="pwd" ><br>
			性　别：<input type="radio" name="sex" value="1" checked=男>男<!--z这里的checked=男，表示默认选择为“男”-->
			<input type="radio" name="sex" value="0">女<br>
			兴趣爱好：<!--下面的checkbox是复选框-->
			<input type="checkbox" name="interest" value="football">足球
			<input type="checkbox" name="interest" value="valleyball">排球
			<input type="checkbox" name="interest" value="basketball">篮球
			<input type="checkbox" name="interest" value="swim">游泳
			<input type="checkbox" name="interest" value="running">跑步<br>
			
			最高学历：<!--列表框，它允许用户从一个下拉列表框（下拉菜单）中选择一项或多项，其功能和单选按钮或复选框的功能相同，但显示方式不一样，
			            列表框由<select>元素创建，列表框中的各个项用<option>元素提供，selected表示默认选项-->
			<select size="1" name="education">
				<option value="" selected>...</option><!--使默认选择项为空，目的是为了防止错误信息的提交！-->
				<option value="高中" >高中</option>
				<option value="本科" >本科</option>
				<option value="硕士" >硕士</option>
			</select><br>

			<!--创建多行文本,对于要接手多行输入信息的情况下，可以使用多行文本输入控件，它可以容纳较多的信息，rows用于指定文本输入控件可视区域
			显示的文本行数，属性cols用于指定文本输入控件可视区域的宽度，在开始标签和结束标签之间出现的文本，将作为文本输入控件中的初始文本而显示-->
			个人简历：<textarea name="personal" rows="5" cols="30">个人简介</textarea><br>

			<!--超链接：<a href="url">...</a>:属性href用于指定链接的目标，目标地址由url定位，在开始标签<a>和结束标签</a>之间输入的文本将作为浏览器中
			显示的链接文本-->
			<a href="http://blog.csdn.net/wanghuawei19930812/article/details/53184894">华伟个人主页</a>

			<!--嵌入图像-->
			<img src="http://www.w3school.com.cn/i/eg_tulip.jpg" width=30 height=30 >

			<input type="hidden" name="id" value="001"><!--这个是隐藏控件，它的作用是：通常存在于服务器脚本动态产生的表单中，用于保存客户端跟踪
														 数据和有用信息，这些数据和信息在用户提交表单的时候会还回服务器端-->
			<input type="reset" value="重写">
			<input type="submit" value="提交到百度">
		</form>
	</body>
</html>

效果图：