大学生HTML5期末作业 Web前端网页制作 html5+css3+js html+css网页设计 美食 美食4个页面
网页作品代码简单，可使用任意HTML辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作）。
获取源码
1，访问该网站 https://download.csdn.net/download/qq_42431718/90204805
2，点击上方下载
目录1
项目视频
html+css网页设计 美食 美食4个页面
页面展示
页面1
页面2
页面3
页面4
代码展示
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>首页</title>
<link rel="icon" href="./images/shrae.png" />
<link href="css/movie_index.css" type=text/css rel=stylesheet>
</head>
<body>
<div class="con">
<div class="head">
<div class="nav">
<ul>
<li><a href="index.html">首页</a></li>
<li><a href="wenhua.html">菌类文化</a></li>
<li><a href="caipu.html">菌类菜谱</a></li>
<li><a href="jiankang.html">健康</a></li>
</ul>
</div>
</div>
<div class="lunbo">
<table width="1000" height="314" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="left">
<div class="flashbox" align="center">
<div id="SwitchBigPic">
<div>
<a href="#"><img class="pic" src="images/01.jpg" /></a>
</div>
<div>
<a href="#"><img class="pic" src="images/02.jpg" /></a>
</div>
<div>
<a href="#"><img class="pic" src="images/03.jpg" /></a>
</div>
<div>
<a href="#"><img class="pic" src="images/04.jpg" /></a>
</div>
<div>
<a href="#"><img class="pic" src="images/05.jpg" /></a>
</div>
</div>
<ul id="SwitchNav">
<li>
<a href="#"><strong>菌鱼汤</strong><img src="images/r1.jpg" /></a>
</li>
<li>
<a href="#"><strong>菌类</strong><img src="images/r2.jpg" /></a>
</li>
<li>
<a href="#"><strong>菌</strong><img src="images/r3.jpg" /></a>
</li>
<li>
<a href="#"><strong>菌</strong><img src="images/r4.jpg" /></a>
</li>
<li>
<a href="#"><strong>菌</strong><img src="images/r5.jpg" /></a>
</li>
</ul>
</div>
</td>
</tr>
</table>
</div>
<div class="main">
<div class="tuijian">
<div class="tuijian_t">展示</div>
<div class="tui_div">
<div class="tui_div_t">菌</div>
<div class="tui_div_img">
<a href="#"><img class="pic" src="images/1.jpg " width="190" height="116" /></a>
</div>
</div>
<div class="tui_div">
<div class="tui_div_t">菌</div>
<div class="tui_div_img">
<a href="#"><img class="pic" src="images/2.jpg" width="190" height="116" /></a>
</div>
</div>
<div class="tui_div">
<div class="tui_div_t">菌</div>
<div class="tui_div_img">
<a href="#"><img class="pic" src="images/3.jpg" width="190" height="116" /></a>
</div>
</div>
</div>
<div class="share">
<div class="share_t">
菌 <a href="#"><img class="pic" src="images/shrae.png" /></a>
</div>
<div class="">
<p>菌知食品科技有限公式</p>
<p>金经理</p>
<p>dfask@gmail.com</p>
</div>
</div>
<div style="clear: both"></div>
</div>
<div class="foot">
<div style="clear: both"></div>
<p>版权所有</p>
</div>
</div>
</body>
</html>
总结
设计一个样式美观又人性化的网页，除了具备扎实的专业知识，还需具备美学和人机工程学等相关知识，优秀的网页应具备以下几个特点:
1.简洁实用
尽量以最高效率的方式将用户所要想得到的信息传送给他就是最好的，要去掉所有的冗余的东西；
2.使用方便
要满足使用者的要求，网页适合使用，显示出其功能美；
3.整体性好
围绕一个统一的目标设计，强调整体的功能性；
4.形象突出
尽量符合网页美的标准，能够使网站的形象得到最大限度的提升，追求雅俗共赏。页面用色协调，布局符合形式美的要求：布局有条理，充分利用美的形式，使网页富有可欣赏性，提高档次。
5.交互式强
发挥网络的优势，想方设法使每个使用者都参与到其中来。
更多推荐
【关注作者|获取更多源码|优质文章】；Web前端网页制作、大学生毕业设计辅导、期末大作业辅导、模板源码、技术咨询等，有兴趣的联系我!
更多优质博客文章、网页模板点击以下链接查阅：
html+css+js网页设计 CSDN博客
html+css+js网页设计 CSDN博客
html+css+js网页设计 CSDN博客
关注作者，点赞收藏博文，获取更多源码，Thanks！5000+完整代码，主题涵盖30+种类型:
