首页 > 代码库 > 制作XX理工大学网页
制作XX理工大学网页
今天上午学完了常用标签和表格。下午的任务是每人独立完成制作一个网页,仿照XX理工大学的官网。刚学没多久,所以选了一类比较简单的网页来练手。基本所有中国大学的官网都差不多都很简单,访问量也不大。
上来先把XX理工大学网页上的几个主要图片截图保存下,当然了那些动态图和图片轮流显示的方式我们都还没学,所以就用一个图来代替。图片都准别好后,就开始写代码了。XX理工大学的官网布局很简单,就是表格中嵌套新的表格。
代码敲了也不知道多长时间,终于写了个大概。检查代码的时候突然发现,代码都写了将近200行了!不过因为不喜欢也没有写注释的习惯,所以代码出问题的时候每次查找都有点儿费劲,幸好代码不长。
最后,终于都做完了,当然有些地方偷了些懒,标题很多地方都用111111111111111代替了。
小结:
在表格中一段文字或图片向上/下/左/右
align left center right
valign top middle bottom
仿照XX理工大学代码:
<body>
<table border="0" width="100%">
<tr>
<td width="50%"><img src="http://www.mamicode.com/img/01.png" width="100%" height="100%"/></td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td width="100%" height="50%">
<center>
<a href="http://www.mamicode.com/w.html" target="_blank">在校生</a>+
<a href="http://www.mamicode.com/w.html" target="_blank">教职工</a>+
<a href="http://www.mamicode.com/w.html" target="_blank">考生</a>+
<a href="http://www.mamicode.com/w.html" target="_blank">校友</a>+
<a href="http://www.mamicode.com/w.html" target="_blank">访客</a>
</center>
</td>
</tr>
<tr>
<td width="100%" height="50%" align="right" valign="bottom"><img src="http://www.mamicode.com/img/02.png"/></td>
</tr>
</table>
</td>
</tr>
</table>
<hr />
<!--下划线-->
<table width="100%">
<tr width="100%">
<td><a href="http://www.mamicode.com/w.html" target="_blank">首页</a></td>
<td><a href="http://www.mamicode.com/w.html" target="_blank">新闻网</a></td>
<td><a href="http://www.mamicode.com/w.html" target="_blank">学校概况</a></td>
<td><a href="http://www.mamicode.com/w.html" target="_blank">机构设置</a></td>
<td><a href="http://www.mamicode.com/w.html" target="_blank">师资队伍</a></td>
<td><a href="http://www.mamicode.com/w.html" target="_blank">科学研究</a></td>
<td><a href="http://www.mamicode.com/w.html" target="_blank">人才培养</a></td>
<td><a href="http://www.mamicode.com/w.html" target="_blank">招生就业</a></td>
<td><a href="http://www.mamicode.com/w.html" target="_blank">大学文化</a></td>
<td><a href="http://www.mamicode.com/w.html" target="_blank">国际交流</a></td>
<td><a href="http://www.mamicode.com/w.html" target="_blank">校友联谊</a></td>
</tr>
</table>
<img src="http://www.mamicode.com/img/03.png"/>
<table border="0" width="100%">
<tr>
<td width="40%">
<table border="0" width="100%">
<tr>
<td>
<b>学校新闻</b><br><br />
<left>更多</left>
本网讯5月2日下午,校党委书记吕传毅在鸿远楼九楼会议室主持召开党委常委会,学习贯彻全省推进“两学一做”学习教育常态化制度化工作座谈会...
<a href="http://www.mamicode.com/w.html">详细</a>
<ul>
<li><p><a href="http://www.mamicode.com/w.html">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html">11111111111111111111111111111</a></p></li>
</ul>
</td>
</tr>
<tr>
<td>
<b>通知公告</b><br />
<ul>
<li><p><a href="http://www.mamicode.com/w.html">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html">11111111111111111111111111111</a></p></li>
</ul>
</td>
</tr>
</table>
</td>
<td width="35%">
<table border="0" width="100%" height="100%">
<tr>
<td>
<b>图说理工 视频理工</b><br /><br />
<img src="http://www.mamicode.com/img/04.png" width="100%" height="100%"/>
</td>
</tr>
<tr>
<td>
<b>媒体报道</b><br />
<ul>
<li><p><a href="http://www.mamicode.com/w.html" target="_blank">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html" target="_blank">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html" target="_blank">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html" target="_blank">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html" target="_blank">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html" target="_blank">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html" target="_blank">11111111111111111111111111111</a></p></li>
</ul>
</td>
</tr>
</table>
</td>
<td>
<table border="0" width="100%" height="100%">
<tr>
<td>
<b>学术活动</b><br />
<p>
<a href="http://www.mamicode.com/w.html" target="_blank">民法通则解析</a><br />
主讲人:赵明宝<br />
地点:大学生艺术中心<br />
</p>
<p>
<a href="http://www.mamicode.com/w.html" target="_blank">对全面从严治党的几点认识</a><br />
主讲人:王绍兴<br />
地点:2号教学楼119室<br />
</p>
<p>
<a href="http://www.mamicode.com/w.html" target="_blank">计算数学研究进展</a><br />
主讲人:董庆英教授<br />
地点:15号教学楼430室<br />
</p>
<p>
<a href="http://www.mamicode.com/w.html" target="_blank">数学文化与大学生素质</a><br />
主讲人:张知学教授<br />
地点15号教学楼505室<br />
</p>
</td>
</tr>
<tr>
<td>
<b>专题信息</b><br />
<ul>
<li><p><a href="http://www.mamicode.com/w.html" target="_blank">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html" target="_blank">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html" target="_blank">11111111111111111111111111111</a></p></li>
<li><p><a href="http://www.mamicode.com/w.html" target="_blank">11111111111111111111111111111</a></p></li>
</ul>
</td>
</tr>
</table>
</td>
</tr>
</table>
<hr />
<table border="0" width="100%">
<tr width="100%">
<td><th><a href="http://www.mamicode.com/w.html" target="_blank">图书馆 </a></th></td>
<td><th>·</th></td>
<td><th><a href="http://www.mamicode.com/w.html" target="_blank">信息公开</a></th></td>
<td><th>·</th></td>
<td><th><a href="http://www.mamicode.com/w.html" target="_blank">招标采购</a></th></td>
<td><th>·</th></td>
<td><th><a href="http://www.mamicode.com/w.html" target="_blank">办公系统</a></th></td>
<td><th>·</th></td>
<td><th><a href="http://www.mamicode.com/w.html" target="_blank">邮件系统</a></th></td>
<td><th>·</th></td>
<td><th><a href="http://www.mamicode.com/w.html" target="_blank">校园VPN</a></th></td>
<td><th>·</th></td>
<td><th><a href="http://www.mamicode.com/w.html" target="_blank">在线学习</a></th></td>
<td><th>·</th></td>
<td><th><a href="http://www.mamicode.com/w.html" target="_blank">站点导航</a></th></td>
</tr>
</table>
<table border="">
<tr>
<td><th>123</th></td>
</tr>
</table>
<img src="http://www.mamicode.com/img/05.png"/>
</body>
制作XX理工大学网页