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>

运行截图

相关推荐
一个有温度的技术博主41 分钟前
Linux 核心命令速查指南:从文件操作到系统运维
linux·服务器
Winner_hwx2 小时前
华为ICT大赛备赛复习1
服务器·网络·华为
宗介波妞3 小时前
Wireshark 抓取 IEC104 报文:常见异常报文排查与标志位解读
服务器·网络·wireshark
云边云科技_云网融合3 小时前
工业互联网组网方案全景解析:从低延迟网络到安全隔离的四大核心支柱
网络·安全·php
小程序设计3 小时前
linux防火墙研究与实现
网络·安全
数据知道3 小时前
加密流量分析——JA3 指纹、TLS 指纹识别与规避
网络·安全·网络安全·密码学
网硕互联的小客服4 小时前
各个版本的Linux系统如何修改远程端口ssh端口?
linux·运维·服务器·网络
小程序设计4 小时前
Wi-Fi网络监控及无线终端定位系统的研究
网络·安全
T1mzhou4 小时前
ARM64 Linux 6.10 内核驱动(12):dd.c:probe/ remove、延迟 probe
linux·服务器·c语言·arm开发·arm
Wang's Blog6 小时前
Java框架快速入门: Spring Security+OAuth2之RBAC与角色分层实践
java·网络·spring