Blogger Information
Blog 7
fans 0
comment 0
visits 1802
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
3月20号作业
Nancy白开水的博客
Original
434 people have browsed it

今天是第四天在中文网学习!

实例

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>3月20号作业</title>
</head>
<body>
<table border="0" cellspacing="1" cellpadding="5" width="960">
<tr height=80>
<td colspan="2">
<iframe src="inc/top.html" name="top" height="70"  width="100%" frameborder="0" scrolling="no"></iframe>
</td>
</tr>
<tr><td width="100%" colspan="2"><hr></td></tr>
<tr>
<td>
<iframe src="inc/left.html" name="left" height="600" width="140" frameborder="0" scrolling="no"></iframe>
</td>
<td>
<iframe src="inc/default.html" name="right" height="600" width="800" frameborder="0" scrolling="no"></iframe>
</td>
</tr>
<tr><td width="100%" colspan="2"><hr></td></tr>
<tr>
<td colspan="2">
<iframe src="inc/footer.html" name="footer" height="70"  width="100%" frameborder="0"></iframe>
</td>
</tr>
</table>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

代码:

admin.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>3月20号作业</title>
</head>
<body>
<table border="0" cellspacing="1" cellpadding="5" width="960">
<tr height=80>
<td colspan="2">
<iframe src="inc/top.html" name="top" height="70"  width="100%" frameborder="0" scrolling="no"></iframe>
</td>
</tr>
<tr><td width="100%" colspan="2"><hr></td></tr>
<tr>
<td>
<iframe src="inc/left.html" name="left" height="600" width="140" frameborder="0" scrolling="no"></iframe>
</td>
<td>
<iframe src="inc/default.html" name="right" height="600" width="800" frameborder="0" scrolling="no"></iframe>
</td>
</tr>
<tr><td width="100%" colspan="2"><hr></td></tr>
<tr>
<td colspan="2">
<iframe src="inc/footer.html" name="footer" height="70"  width="100%" frameborder="0"></iframe>
</td>
</tr>
</table>
</body>
</html>

top.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>top</title>
</head>
<body>
<table border="0">
<tr>
<td valign="middle"><img src="../images/logo1.png" width="40"></td>
<td width="650" valign="middel"><h2>天津港一站通系统</h2></td>
<td valign="bottom"><p><a href="">admin</a>&nbsp;&nbsp;<a href="">退出</a></p></td>
</tr>
</table>
</body>
</html>

footer.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>footer</title>
</head>
<body>
<p>
<a href="default.html" target="right">网站首页</a>&nbsp;&nbsp;&nbsp;&nbsp;
<a>联系方式:15612345678</a>&nbsp;&nbsp;&nbsp;&nbsp;
<a>联系地址:天津港码头</a>&nbsp;&nbsp;&nbsp;&nbsp;
<a>版权所有:京ICP证000007</a>
</p>
</body>
</html>

left.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>left</title>
</head>
<body>
<h4><img src="../images/07.jpg" width="20">计费管理</h4>
<ul type="none">
<li><a href="billInforSelect.html" target="right" style="font-size: 14px;">计费信息查询</a></li>
</ul>
<hr>
<h4><img src="../images/05.jpg" width="20">费率管理</h4>
<ul type="none">
<li><a href="FeeItemManage.html" target="right" style="font-size:14px;">费收项目管理</a></li>
</ul>
<hr>
<h4><img src="../images/06.jpg" width="20">基础数据管理</h4>
<ul type="none">
<li><a href="importManage.html" target="right" style="font-size:14px;">进口舱单更正</a></li>
</ul>
</body>
</html>

default.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>网站首页</title>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="5">
<caption><h3>系统信息配置表</h3></caption>
<tr>
<th width="160" bgcolor="lightblue">服务器</th>
<td width="400">Apache 2.8.1</td>
</tr>
<tr>
<th bgcolor="lightblue">PHP版本</th>
<td>PHP5.6+</td>
</tr>
<tr>
<th bgcolor="lightblue">数据库</th>
<td>MySQL 5.7</td>
</tr>
<tr>
<th bgcolor="lightblue">可用磁盘空间</th>
<td>395G</td>
</tr>
<tr>
<th bgcolor="lightblue">可用内存</th>
<td>3.2G</td>
</tr>
</table>
</body>
</html>

billInforSelect.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>计费信息查询</title>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="5" width="800">
<caption><h3>计费信息查询</h3></caption>
<table border="0" cellspacing="0" cellpadding="5" width="80%">
<!-- tr*1>td*4 -->
<tr>
<td width="80">提单号:</td>
<td>
<input type="text" name="selectKey">
</td>
<td colspan="2">
<input type="submit" name="button" value="检索" style="width: 100px">
</td>
</tr>
</table>
<table height="20">
<tr>
<td>
</td>
</tr>
</table>
<div style="overflow-x: auto; overflow-y: scroll; width: 657px; text-align: center;">
<table border="1" cellspacing="0" cellpadding="5" width="640">
<thead>
<tr bgcolor="lightcyan">
<th>序号</th>
<th>中文船名</th>
<th>航次</th>
<th>提单号</th>
<th>结费期</th>
<th>总费用</th>
<th colspan="2">操作</th>
</tr>
<tr>
<td>01</td>
<td>凌云河</td>
<td>332N</td>
<td>COSU4504894210</td>
<td>2016-07-07</td>
<td>¥1,400</td>
<td>
<a href=""><img src="../images/edit.jpg" width="30" alt="编辑" title="编辑"></a>
<a href=""><img src="../images/del.jpg" width="30" alt="删除" title="删除"></a>
</td>
</tr>
<tr>
<td>02</td>
<td>凌云河</td>
<td>332N</td>
<td>COSU4504894211</td>
<td>2016-07-09</td>
<td>¥1,500</td>
<td>
<a href=""><img src="../images/edit.jpg" width="30" alt="编辑" title="编辑"></a>
<a href=""><img src="../images/del.jpg" width="30" alt="删除" title="删除"></a>
</td>
</tr>
<tr>
<td>03</td>
<td>凌云河</td>
<td>332N</td>
<td>COSU4504894212</td>
<td>2016-07-07</td>
<td>¥1,600</td>
<td>
<a href=""><img src="../images/edit.jpg" width="30" alt="编辑" title="编辑"></a>
<a href=""><img src="../images/del.jpg" width="30" alt="删除" title="删除"></a>
</td>
</tr>
</tbody>
</table>
</div>
</table>

<p>
<a href="">首页</a>
<a href="">上一页</a>
<a href="">1</a>
<a href="">2</a>
<a href="">3</a>
<a href="">...</a>
<a href="">下一页</a>
<a href="">尾页</a>
</p>
</body>
</html>


<!-- 问题
1.tr*1>td*4没起作用
2.table怎么在div内居中显示
 -->
 
 FeeItemManage.html
 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>费收项目管理</title>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="5" width="80%">
<caption><h3>费收项目管理</h3></caption>
<tr bgcolor="lightcyan">
<th>序号</th>
<th>计费业务类型</th>
<th>计费项目</th>
<th>是否生效</th>
</tr>
<tr>
<td rowspan="3">01</td>
<td rowspan="3">进口提箱</td>
<td>制冷费</td>
<td><input type="checkbox" name=""></td>
</tr>
<tr>
<td>保安费</td>
<td><input type="checkbox" name=""></td>
</tr>
<tr>
<td>港建费</td>
<td><input type="checkbox" name=""></td>
</tr>
<tr>
<td rowspan="3">02</td>
<td rowspan="3">进口查验</td>
<td>转栈费</td>
<td><input type="checkbox" name=""></td>
</tr>
<tr>
<td>保安费</td>
<td><input type="checkbox" name=""></td>
</tr>
<tr>
<td>港建费</td>
<td><input type="checkbox" name=""></td>
</tr>
<tr>
<td rowspan="3">03</td>
<td rowspan="3">出口查验</td>
<td>港务费</td>
<td><input type="checkbox" name=""></td>
</tr>
<tr>
<td>保安费</td>
<td><input type="checkbox" name=""></td>
</tr>
<tr>
<td>港建费</td>
<td><input type="checkbox" name=""></td>
</tr>
</table>
<p>
<a href="">首页</a>
<a href="">上一页</a>
<a href="">1</a>
<a href="">2</a>
<a href="">3</a>
<a href="">...</a>
<a href="">下一页</a>
<a href="">尾页</a>
</p>
</body>
</html>

importManage.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>进口舱单更正</title>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="5" width="100%">
<caption><h3>进口舱单更正</h3></caption>
<table>
<tr>
<td width="20%">箱号:</td>
<td>
<input type="text" name="selectKey">
</td>
<td colspan="2" width="59%">
<input type="submit" name="button" value="提单号筛选" style="width: 100px">
</td>
</tr>
</table>
<table height="20">
<tr>
<td>
</td>
</tr>
</table>
<table border="1" cellspacing="0" cellpadding="5" width="80%">
<tr bgcolor="lightcyan">
<th>序号</th>
<th>箱号</th>
<th>提单号</th>
<th>添加操作</th>
<th colspan="2">更新操作</th>
</tr>
<tr>
<td rowspan="2">01</td>
<td rowspan="2">TEMU29938883</td>
<td>GFFF4455656444</td>
<td rowspan="2">
<a href=""><img src="../images/06.jpg" width="40"></a>
</td>
<td>
<a href=""><img src="../images/edit.jpg" width="20"></a>
&nbsp;&nbsp;
<a href=""><img src="../images/del.jpg" width="20"></a>
</td>
</tr>
<tr>
<td>GFFF4455656448</td>
<td>
<a href=""><img src="../images/edit.jpg" width="20"></a>
&nbsp;&nbsp;
<a href=""><img src="../images/del.jpg" width="20"></a>
</td>
</tr>
<tr>
<td rowspan="2">02</td>
<td rowspan="2">TEMU29938885</td>
<td>GFFF4455656450</td>
<td rowspan="2">
<a href=""><img src="../images/06.jpg" width="40"></a>
</td>
<td>
<a href=""><img src="../images/edit.jpg" width="20"></a>
&nbsp;&nbsp;
<a href=""><img src="../images/del.jpg" width="20"></a>
</td>
</tr>
<tr>
<td>GFFF4455656550</td>
<td>
<a href=""><img src="../images/edit.jpg" width="20"></a>
&nbsp;&nbsp;
<a href=""><img src="../images/del.jpg" width="20"></a>
</td>
</tr>
<tr>
<td rowspan="2">03</td>
<td rowspan="2">TEMU29938900</td>
<td>GFFF4455658650</td>
<td rowspan="2">
<a href=""><img src="../images/06.jpg" width="40"></a>
</td>
<td>
<a href=""><img src="../images/edit.jpg" width="20"></a>
&nbsp;&nbsp;
<a href=""><img src="../images/del.jpg" width="20"></a>
</td>
</tr>
<tr>
<td>GFFF4455658653</td>
<td>
<a href=""><img src="../images/edit.jpg" width="20"></a>
&nbsp;&nbsp;
<a href=""><img src="../images/del.jpg" width="20"></a>
</td>
</tr>
</table>
</table>
</body>
</html>

手写代码:

微信图片_20180326205750.jpg


Correction status:qualified

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post