HTML的总结作业

作业1

参照图使用表格定位表单。

参考代码

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8"/>

<title></title>

</head>

<body>

<form action="">

<table width="600"height="500" border="1" align="center">

<tr bgcolor=#bdbdbd align="center" >

<td colspan="2" align="center"

>用户注册</td>

</tr>

<tr>

<td align="right"

>用户名</td>

<td> <label for="edit"></label>

<input type="edit" value="" /></td>

</tr>

<tr>

<td align="right"

>密码</td>

<td> <label for="edit"></label>

<input type="password" value=""/></td>

</tr>

<tr>

<td align="right"

><label for="hob">

性别

</label></td>

<td>

<input type="radio" name="性别" value="男" />男

<input type="radio" name="性别" value="女" />女

</td>

</tr>

<tr>

<td align="right">

<label for="hob">

爱好

</label></td>

<td><input type="checkbox" name="听音乐" value="听音乐" />听音乐

<input type="checkbox" name="写作" value="写作" />写作

<input type="checkbox" name="体育" value="体育" />体育

</td>

</tr>

<tr>

<td align="right">省份</td>

<td>

<select name="省份">

<option >陕西</option>

<option >山西</option>

<option >广西</option>

<option >西藏</option>

</select>

</td>

</tr>

<tr>

<td align="right">自我介绍</td>

<td>

<textarea name="" cols="50" rows="10"></textarea>

</td>

</tr>

<tr bgcolor=#bdbdbd align="center" >

<td colspan="2" align="center">

<input type="submit" name="">

<input type="reset">

</td>

</table>

</from>

</body>

运行截图

作业2

查考代码

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8" />

<title></title>

</head>

<body>

<tr>

<h1>工商银行电子汇款单</h1>

</tr>

<table width="1200" height="300" border="1">

<tr>

<td width="100" colspan="2"><b>回单类型</b></td>

<td width="500">网上转账汇款</td>

<td width="100"colspan="2"><b>指令序号</b></td>

<td >HQH00000000000000131878172</td>

</tr>

<tr >

<td rowspan="4" width="10"><b>收款人</b></td>

<td width="50">户名</td>

<td width="500">老马</td>

<td rowspan="4" width="10"><b>收款人</b></td>

<td width="50">户名</td>

<td width="500">老刘</td>

</tr>

<tr>

<td><b>卡号</b></td>

<td>0000000000000000001</td>

<td><b>卡号</b></td>

<td>0000000000000000001</td>

</tr>

<tr>

<td>地区</td>

<td>南京</td>

<td>地区</td>

<td>杭州</td>

</tr>

<tr>

<td><b>网点</b></td>

<td>工商江苏南京业务处理中心</td>

<td><b>网点</b></td>

<td>江苏徐州业务中心</td>

</tr>

<tr>

<td colspan="2"><b>币种</b></td>

<td>人民币</td>

<td colspan="2"><b>钞汇标志</b></td>

<td>钞票</td>

</tr>

<tr>

<td colspan="2"><b>金额</b></td>

<td>1.00元</td>

<td colspan="2"><b>手续费</b></td>

<td>0.57元</td>

</tr>

<tr>

<td colspan="2"><b>合计</b></td>

<td colspan="4">人民币(大写):壹园整</td>

</tr>

<tr>

<td colspan="2"><b>交易时间</b></td>

<td><i>2017年6月1日</i></td>

<td colspan="2"><b>时间戳</b></td>

<td>2017-06-01-13.00.00.00000</td>

</tr>

</table>

<td>

票据打印时间:2017-06-01:15:00:12<br />

</td>

<td>

<del>票据打印单位:江苏徐州业务中心</del><br />

</td>

<td>

<del>操作员:大曾</del><br />

</td>

</body>

</html>

运行截图

作业三

豆瓣电影

参考代码

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>form</title>

</head>

<body>

<from action>

<table width="100%" height="100%" border="0" cellpadding="10" cellspacing="10">

<tr>

<td colspan="2" align="left"><h1>热门电影板块</h1></td>

</tr>

<tr align="left" cellpadding="10" cellspacing="10">

<td><b>最近热门电影</b></td>

<td>热门</td>

<td>最新</td>

<td>豆瓣高分</td>

<td>冷门佳片</td>

<td>华语</td>

<td>欧美</td>

<td>韩国</td>

<td>日本</td>

<td>更多>></td>

</tr>

<table width="100%" height="100%" border="0"

<tr>

<td><img src="./222.webp"></td>

<td><img src="./222.webp"></td>

<td><img src="./222.webp"></td>

<td><img src="./222.webp"></td>

</tr>

<tr>

<td align="center">鸡哥一号 2.5</td>

<td align="center">鸡哥二号 2.5</td>

<td align="center">鸡哥三号 2.5</td>

<td align="center">鸡哥四号 2.5</td>

</tr>

</table>

<table width="100%" height="100%" border="0">

<tr>

<td><img src="./222.webp"></td>

<td><img src="./222.webp"></td>

<td><img src="./222.webp"></td>

<td><img src="./222.webp"></td>

</tr>

<tr>

<td align="center">鸡哥五号 2.5</td>

<td align="center">鸡哥六号 2.5</td>

<td align="center">鸡哥七号 2.5</td>

<td align="center">鸡哥八号 2.5</td>

</tr>

</table>

</table>

</from>

</body>

</html>

运行截图

相关推荐
web打印社区3 分钟前
web-print-pdf:突破浏览器限制,实现专业级Web静默打印
前端·javascript·vue.js·electron·html
喵叔哟8 分钟前
02-CSharp基础语法快速入门
服务器
B2_Proxy1 小时前
IP 来源合规性,正在成为全球业务的隐性门槛
网络·爬虫·网络协议·安全
AI逐月1 小时前
tmux 常用命令总结:从入门到稳定使用的一篇实战博客
linux·服务器·ssh·php
想逃离铁厂的老铁1 小时前
Day55 >> 并查集理论基础 + 107、寻找存在的路线
java·服务器
MMME~2 小时前
Ansible Playbook高效自动化实战指南
网络·自动化·ansible
数据安全科普王2 小时前
从 HTTP/1.1 到 HTTP/3:协议演进如何改变 Web 性能?
网络·其他
舰长1152 小时前
linux 实现文件共享的实现方式比较
linux·服务器·网络
学***54232 小时前
如何轻松避免网络负载过大
开发语言·网络·php
weixin_395448912 小时前
main.c_cursor_0129
前端·网络·算法