学生川菜水煮鱼网页设计作品

• 网页技术点
• 作品介绍
• 制作代码演示
• • 导航代码
  • 图片列表
• 效果演示
• 成品地址

网页技术点

表格table布局、透明底色、H5视频标签

作品介绍

本静态HTML网页作业成品设计简单，使用dreamweaver采用表格布局制作，网页中的图片使用PS裁剪制作，顶部导航使用CSS设置了透明底色效果。共3个页面，首页、文字页面、视频页面。视频采用VIDEO标签嵌入视频，代码简单，适合大一网页设计作业或对作品技术水平要求低的。

制作代码演示

导航代码

<table width="1000" height="500" border="0" id="nav">
  <tr id="menu">
    <td><a href="">网站首页</a></td>
    <td><a href="">菜品介绍</a></td>
    <td><a href="">视频教学</a></td>
  </tr>
  <tr>
    <td height="430px"></td>
    <td></td>
    <td></td>
  </tr>
</table>

图片列表

<table width="1000"  border="0" id="chuan">
  <tr>
    <td align="center"><a href="jieshao.html"><img src="image/szy1.jpg" width="495" height="260" /></a></td>
    <td align="center"><a href="shipin.html" ><img src="image/szy2.jpg" width="495" height="260" /></a></td>
  </tr>
    <tr>
    <td align="center"><a href="jieshao.html">菜品介绍</a></td>
    <td align="center"><a href="shipin.html">视频教学</a></td>
  </tr>
</table>

效果演示

成品地址

stu-works/html/meishi/245.html