示例1
实现代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
#abc {
border: 1px solid black;
}
tr,td{
border: 1px solid black;
}
</style>
</head>
<body>
<table id="abc">
<tr>
<td colspan="2">回单类型</td>
<td>网上转账汇款</td>
<td colspan="2">指令序号</td>
<td>HQH00000000000000138917</td>
</tr>
<tr>
<td rowspan="4">收款人</td>
<td>户名</td>
<td>老王</td>
<td rowspan="4">付款人</td>
<td>户名</td>
<td>老刘</td>
</tr>
<tr>
<td>卡号</td>
<td>00000000001</td>
<td>卡号</td>
<td>00000000002</td>
</tr>
<tr>
<td>地区</td>
<td>南京</td>
<td>地区</td>
<td>杭州</td>
</tr>
<tr>
<td>网点</td>
<td>工商江苏南京业务处理中心</td>
<td>网点</td>
<td>江苏徐州业务中心</td>
</tr>
<tr>
<td colspan="2">币种</td>
<td>人民币</td>
<td colspan="2">钞汇标志</td>
<td>钞票</td>
</tr>
<tr>
<td colspan="2">金额</td>
<td>1.00元</td>
<td colspan="2">手续费</td>
<td>0.57元</td>
</tr>
<tr>
<td colspan="2">合计</td>
<td colspan="4">人民币（大写）：壹圆整</td>
</tr>
<tr>
<td colspan="2">交易时间</td>
<td>2017年6月1日</td>
<td colspan="2">时间戳</td>
<td>2017-06-01-13.00.00。 0000</td>
</tr>
</table>
<p>票据打印时间：2017-06-01 15:00:12</p><p><del>票据打印单位：江苏徐州业务中心</del></p><p>操作员：大曾</p>
</body>
</html>
效果展示：
示例2
实现代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>将进酒<small> 君不见黄河之水天上来</small></h1>
<table>
<tr>
<td rowspan="14"><img src="./李白.jpg"></td>
</tr>
<tr>
<td>君不见黄河之水天上来，奔流到海不复回。</td>
</tr>
<tr>
<td>君不见高堂明镜悲白发，朝如青丝暮成雪。</td>
</tr>
<tr>
<td>人生得意须尽欢，莫使金樽空对月。</td>
</tr>
<tr>
<td>天生我材必有用，千金散尽还复来。</td>
</tr>
<td>烹羊宰牛且为乐，会须一饮三百杯。</td>
<tr>
<td>岑夫子，丹丘生，将进酒，杯莫停。</td>
</tr>
<tr>
<td>与君歌一曲，请君为我侧耳听。</td>
</tr>
<tr>
<td>钟鼓馔玉不足贵，但愿长醉不复醒。</td>
</tr>
<tr>
<td>古来圣贤皆寂寞，惟有饮者留其名。</td>
</tr>
<tr>
<td>陈王昔时宴平乐，斗酒十千恣欢谑。</td>
</tr>
<tr>
<td>主人何为言少钱，径须沽取对君酌。</td>
</tr>
<tr>
<td>五花马，千金裘，</td>
</tr>
<tr>
<td>呼儿将出换美酒，与尔同销万古愁。</td>
</tr>
</table>
</body>
</html>
效果展示 ：
示例3
实现代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>热门电影板块</h1>
<table width="800">
<tr>
<td>最近热门电影</td>
<td>热门</td>
<td>最新</td>
<td>豆瓣高分</td>
<td>冷门佳作</td>
<td>华语</td>
<td>欧美</td>
<td>韩国</td>
<td>日本</td>
<td width="100"></td>
<td>更多>></td>
</tr>
<table>
<table>
<tr>
<td><img width="200" height="243" src="./images/movie1.jpg"></td>
<td><img width="200" height="243" src="./images/movie2.jpg"></td>
<td><img width="200" height="243" src="./images/movie3.jpg"></td>
<td><img width="200" height="243" src="./images/movie4.jpg"></td>
</tr>
<tr>
<td><P>猜火车 8.1</P></td>
<td>贝尔科实验 6.0</td>
<td>加州公路巡警 6.8</td>
<td>歌声不绝 6.3</td>
</tr>
<tr>
<td><img width="200" height="243" src="./images/movie5.jpg"></td>
<td><img width="200" height="243" src="./images/movie6.jpg"></td>
<td><img width="200" height="243" src="./images/movie7.jpg"></td>
<td><img width="200" height="243" src="./images/movie8.jpg"></td>
</tr>
<tr>
<td><P>明日的我与昨日的我</P></td>
<td>速度与激情8</td>
<td>极速特工</td>
<td>金刚狼3：殊死一战</td>
</tr>
</table>
</body>
</html>
效果展示：
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
