第一次作业

一.用户注册

1.源码

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>用户注册</title>
		<style>
			td{
				width: 100px;
				height: 25px;
			}
			thead td{
				background-color: #ccc;
			}
			tbody td{
				background-color: #ddd;
			}
			tfoot td{
				background-color: #ccc;
			}
		</style>
	</head>
	<body>
		<form method="get">
			<table>
				<thead>
					<tr >
						<td colspan="2" align="center">用户注册</td>
					</tr>
				</thead>
				<tbody>			
					<tr>
						<td>用户名</td>
						<td><input type="text" name="用户名"></td>
					</tr>
					<tr>
						<td>密码</td>
						<td><input type="password" name="密码"></td>
					</tr>
					<tr>
						<td>性别</td>
						<td>
							<input type="radio" name="性别">男
							<input type="radio" name="性别">女
						</td>
					</tr>
					<tr>
						<td>爱好</td>
						<td>
							<input type="checkbox" name="写作">写作
							<input type="checkbox" name="听音乐">听音乐
							<input type="checkbox" name="体育">体育
						</td>
					</tr>
					<tr>
						<td>省份</td>
						<td>
							<select name="省份">
								<option value="陕西">陕西</option>
								<option value="山西">山西</option>
								<option value="四川">四川</option>
							</select>
						</td>
					</tr>
					<tr>
						<td>自我介绍</td>
						<td><textarea name="自我介绍" cols="25" rows="5">这个家伙什么也没留下</textarea></td>
					</tr>
				</tbody>
				<tfoot>		
					<tr>
						<td align="center" colspan="2">
							<input type="send">
							<input type="reset">
						</td>
					</tr>
				</tfoot>

			
			</table>
		</form>

	</body>
</html>

2.结果

二.工商银行电子汇款单

1.源码

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>工商银行电子汇款单</title>
		<style>
			td{
				height: 50px;
				width: 200px;
				font-size: 1px;
				padding: 3px;
			}
			.one{
				width: 400px;
			}
			.two{
				width: 15px;
			}
		</style>
	</head>
	<body initial-scale=100%>
		<div>
			<div class="top">
				<h1>工商银行电子汇款单</h1>
			</div>
			<div>
				<table border="1px" cellspacing=0 >
					<tr>
						<td colspan="2">
							回单类型
						</td>
						<td class="one">
							网上转账汇款
						</td>
						<td colspan="2">
							指令序号
						</td>
						<td class="one">
							HQH0000000000000013878172
						</td>
					</tr>

					<tr>
						<td rowspan="4" class="two">
							收款人
						</td>
						<td>
							户名
						</td>
						<td class="one">
							老牟
						</td>
						<td rowspan="4" class="two">
							付款人
						</td>
						<td>
							户名
						</td>
						<td class="one">
							老刘
						</td>
					</tr>
					
					<tr>

						<td>
							卡号
						</td>
						<td class="one">
							000000000001
						</td>

						<td>
							卡号
						</td>
						<td class="one">
							000000000002
						</td>
					</tr>
					
					<tr>

						<td>
							地区
						</td>
						<td class="one">
							南京
						</td>
						
						<td>
							地区
						</td>
						<td class="one">
							杭州
						</td>
					</tr>
					
					<tr>

						<td>
							网点
						</td>
						<td class="one">
							工商江苏南京业务处理中心
						</td>

						<td>
							网点
						</td>
						<td class="one">
							江苏徐州业务中心
						</td>
					</tr>
					
					<tr>
						<td colspan="2">
							币种
						</td>
						<td class="one">
							人民币
						</td>
						<td colspan="2">
							钞汇标志
						</td>
						<td class="one">
							钞覃
						</td>
					</tr>
					
					<tr>
						<td colspan="2">
							金额
						</td>
						<td class="one">
							1.00元
						</td>
						<td colspan="2">
							手续费
						</td>
						<td class="one">
							0.57元
						</td>
					</tr>
					
					<tr>
						<td colspan="2">
							合计
						</td>
						<td colspan="4">
							人民币( 大写) : 壹圆整
						</td>
					</tr>
					
					<tr>
						<td colspan="2">
							交易时间
						</td>
						<td class="one">
							2017年6月1日
						</td>
						<td colspan="2">
							时间戳
						</td>
						<td class="one">
							2017-06-01-13.00.00,00000
						</td>
					</tr>
				</table>
			</div>
			<div>
				<p>票据打印时间 : 2017-06-01 15:00:12</p>
				<p><del>票据打印单位:江苏徐州业务中心</del></p>
				<p>操作员: 大曾</p>
			</div>
		</div>
	</body>

</html>

2.结果

三.李白诗词

1.源码

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>李白诗词</title>
		<style>
			img {
				width: 275px;
				height: 359px;
			}
			.one {
				display: inline;
			}
			.two {
				display: inline;
				width: 275px;
				height: 359px;
			}
		</style>
	</head>
	<body>
		<div>
			<div>
				<h1 style="display: inline;">将进酒 <h2 style="display: inline;">君不见黄河之水天上来</h2></h1>
			</div>
			<div>
				<div class="two">
					<table>
						<tr>
							<td>
								<img src="http://mms1.baidu.com/it/u=650382861,4021825393&fm=253&app=120&f=JPEG&fmt=auto&q=75?w=500&h=683" alt="加载失败">
							</td>
							<td>
								<pre>
君不见,黄河之水天上来,奔流到海不复回。

君不见,高堂明镜悲白发,朝如青丝暮成雪。	
				
人生得意须尽欢,莫使金樽空对月。		
			
天生我材必有用,千金散尽还复来。	
				
烹羊宰牛且为乐,会须一饮三百杯。	
				
岑夫子,丹丘生,将进酒,杯莫停。	
				
与君歌一曲,请君为我倾耳听。		
			
钟鼓馔玉不足贵,但愿长醉不愿醒。	
				
古来圣贤皆寂寞,惟有饮者留其名。
					
陈王昔时宴平乐,斗酒十千恣欢谑。	
				
主人何为言少钱,径须沽取对君酌。	
				
五花马,千金裘,

呼儿将出换美酒,与尔同销万古愁。

								</pre>
							</td>
						</tr>
					</table>
				</div>
			</div>

		</div>
	</body>
</html>

2.结果

四.豆瓣电影

1.源码

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>豆瓣电影</title>
		<style>
			td{
				width: 80px;
			}
			img{
				width: 214.5px;
				height: 303.75px;
			}
		</style>
	</head>
	<body>
		<div>
			<div class="top">
				<h1>
					热门电影板块
				</h1>
			</div>
			<hr>
			<div class="mid">
				<table>
					<tr>
						<td style="width: 200px;">
							<strong>最近热门电影</strong>
						</td>
						<td>
							热门
						</td>
						<td >
							最新
						</td>
						<td style="width: 100px;">
							豆瓣高分
						</td>
						<td style="width: 100px;">
							冷门佳片
						</td>
						<td>
							华语
						</td>
						<td>
							欧美
						</td>
						<td>
							韩国
						</td>
						<td style="width: 250px;">
							日本
						</td>
						<td>
							更多>>
						</td>
					</tr>
				</table>
				<hr>
				<div>
					<table>
						<tr>
							<td>
								<div>
									<img src="https://img5.mtime.cn/pi/2017/05/27/151644.72923083_1000X1000.jpg" alt="加载失败">
									<p>猜火车8.1</p>
								</div>
							</td>
							<td>
								<div>
									<img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2Fa0dcd5e3-26e8-424f-b9d4-92bb22eeef39%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1680959737&t=af5b47d510f24fce3cc614a525c083ff" alt="加载失败">
									<p>贝尔科实验 6.0</p>
								</div>
							</td>
							<td>
								<div>
									<img src="https://img5.mtime.cn/pi/2017/06/21/151309.48410670_1000X1000.jpg" alt="加载失败">
									<p>加州公路巡警 6.8</p>
								</div>
							</td>
							<td>
								<div>
									<img src="https://img5.mtime.cn/pi/2018/10/23/143724.86915214_1000X1000.jpg" alt="加载失败">
									<p>歌声不绝 6.3</p>
								</div>
							</td>
						</tr>
						
						<tr>
							<td>
								<div>
									<img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg1.doubanio.com%2Fview%2Fphoto%2Fl%2Fpublic%2Fp2472730347.jpg&refer=http%3A%2F%2Fimg1.doubanio.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1680959984&t=7818d8bf643f9c6aa530f1e8103c6665" alt="加载失败">
									<p>明日的我与昨日的我</p>
								</div>
							</td>
							<td>
								<div>
									<img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fss2.meipian.me%2Fusers%2F49803908%2F72433f33b4504e1aab235dbcacd435ee.jpg%3Fmeipian-raw%2Fbucket%2Fivwen%2Fkey%2FdXNlcnMvNDk4MDM5MDgvNzI0MzNmMzNiNDUwNGUxYWFiMjM1ZGJjYWNkNDM1ZWUuanBn%2Fsign%2Fe99718c14b29e55b2dcd7d813d3b4959.jpg&refer=http%3A%2F%2Fss2.meipian.me&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1680960021&t=24f9b87cf5a8d594571d054fc39e63bf" alt="加载失败">
									<p>速度与激情8</p>
								</div>
							</td>
							<td>
								<div>
									<img src="https://img1.baidu.com/it/u=477080153,3110633821&fm=253&fmt=auto&app=138&f=JPEG?w=352&h=499" alt="加载失败">
									<p>极速特工</p>
								</div>
							</td>
							<td>
								<div>
									<img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg3.doubanio.com%2Fview%2Fphoto%2Fl%2Fpublic%2Fp2480195052.jpg&refer=http%3A%2F%2Fimg3.doubanio.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1680960108&t=50d4ea4c71a380ab3edd2718c38f7427" alt="加载失败">
									<p>金刚狼3:殊死一战</p>
								</div>
							</td>
						</tr>
					</table>
				</div>
			</div>
		</div>
	</body>
</html>

2.结果

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值