寒假第7页作业

最新推荐文章于 2019-02-12 20:20:03 发布

liujia20001123

最新推荐文章于 2019-02-12 20:20:03 发布

阅读量179

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/liujia20001123/article/details/87112734

本文介绍了一个免费体验登陆页面的设计方案，包括HTML和CSS代码，用于收集用户的基本信息，如姓名、邮箱、电话等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>免费体验登陆页面</title>
		<style>
			ul{
				margin: 0px;
				padding:0px;
				list-style-type: none;
					line-height: 35px;
					padding: 100px;
				padding-left: 50px;
			}
			.text2{
				border: 1px solid black;
				width:312px;
				height:353px;
			}
			.text1{
				background: url(img/bg.jpg) no-repeat;
				width:312px;
				height:353px;
			}
			#div{
				margin: 0px auto; 8 
				margin-left: 35px;
			}
			input{
				border: 0px solid;
				border-radius: 4px;
			}
			select{
				border: 1px solid;
				border-radius: 4px;
			}
		</style>
	</head>
	<body class="text2">
		<form method="post"action="">
			<div>
		<ul class="text1">
			<li>*姓名：<input name="name"type="text"/></li>
			<li>*邮箱：<input name="email"type="email"/></li>
			<li>*电话：<input name="number"type="number"</li>
			<li>性别：<select name="sex" >
				<option value="">请选择</option>
				<option value="">男</option>
				<option value="">女</option>
			</select></li>
			<li>年龄:<select>
				<option>请选择</option>
				<option>1</option>
				<option>2</option>
				<option>3</option>
			</select></li>
			 <input id="div" type="image"src="img/btn.jpg" />
		</ul>
			</div>
		</form>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>免费体验登陆页面</title>
		<style>
			ul{
				margin: 0px;
				padding:0px;
				list-style-type: none;
					line-height: 35px;
					padding: 100px;
				padding-left: 50px;
			}
			.text2{
				border: 1px solid black;
				width:312px;
				height:353px;
			}
			.text1{
				background: url(img/bg.jpg) no-repeat;
				width:312px;
				height:353px;
			}
			#div{
				margin: 0px auto; 8 
				margin-left: 35px;
			}
			input{
				border: 0px solid;
				border-radius: 4px;
			}
			select{
				border: 1px solid;
				border-radius: 4px;
			}
		</style>
	</head>
	<body class="text2">
		<form method="post"action="">
			<div>
		<ul class="text1">
			<li>*姓名：<input name="name"type="text"/></li>
			<li>*邮箱：<input name="email"type="email"/></li>
			<li>*电话：<input name="number"type="number"</li>
			<li>性别：<select name="sex" >
				<option value="">请选择</option>
				<option value="">男</option>
				<option value="">女</option>
			</select></li>
			<li>年龄:<select>
				<option>请选择</option>
				<option>1</option>
				<option>2</option>
				<option>3</option>
			</select></li>
			 <input id="div" type="image"src="img/btn.jpg" />
		</ul>
			</div>
		</form>
	</body>
</html>