《毕业论文 --网站的设计与实现（中华美食网站）.doc》由会员分享，可在线阅读，更多相关《毕业论文 --网站的设计与实现（中华美食网站）.doc（21页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、毕业论文 -网站的设计与实现中华美食网站【毕业论文】 辽阳职业技术学院毕业论文设计题 目： 网站的设计与实现 中华美食网站 系 别： 计算机科学系 专 业： 计算机应用技术 学生姓名： 宋佳 指导教师： 李寅杰 2021 年 6月 1日目录第一章 前言1 第二章 开放工具和运行环境22.1 网站设计的根本知识 22.2 Dreamweaver 8 简介 2.3 6HTML 32.4 HTML 技术介绍32.5 网站运行环境6.2 系统的可行性分析6第四章 网站的设计与实现 74.1 网站的总体设计.1.1 网站结构图 网站的风格 7 素材准备7 首页8 网站主要代码 10第五章 网站的测试与维
2、护 14结论 15致谢 16参考文献 17前 言因特网正在改变世界，它促成了网络经济雏形的形成，特别是电 子商务正由新概念走向实用化。由于因特网具有传播信息容量极大、 形态多样、迅速方便、全球覆盖、自由和交互的特点，已经开展成为 新的传播媒体，所以全球几乎各个企业、机构纷纷建立自己的 Web 站点。Web 站点是向用户或潜在客户提供信息 包括产品和效劳 的一 种方式。其文档所包含的内容是由被称为超文本 HyperText 的文本、 图形图象、声音，甚至电影等组成。使这些超文本能够有机地关联并 可使浏览器识别，是通过 HTML 语言 HyperText Markup Language 超文本标记
3、语言 实现的。同时 CGI Common Gateway Interface 公 共网关接口 能使 Web 具有交互功能。Web 站点指引用户浏览该站 点或其他站点上的分页信息， 可以通过表格和电子邮件的连接提供双 向交互方式。站点建立后，你的企业就在国内、甚至在国际上有了一 席之地，有了每周 7 天、每天 24 小时的“虚拟门市部。网站是未来 企业开展电子商务的根底设施和信息平台，它是“知识经济的制高 点，企业的网址犹如企业的商标和品牌一样，是反映企业形象和文化 的巨大的无形资产。 因此企业网站规划必须注意以下几个方面： 目标明确、 目标明确、定位正确 Web 站点的设计是企业或机构开展战略
4、的重要组成局部。 .1 网站设计的根本知识静态编程最重要的特征就是由程序自动生成网页， 最终形成供浏览器解释的 HTML。那么如何设计出精美的网页以及动态更新交互的站点，这就需要网页编程 与网页制作相结合。本章主要介绍网站建设所必须掌握的根底知识，如网页文档 的结构、超链接、表格和表单等根本的 HTML 标识的写法要求，网页编辑的常用 工具，动态网站工程工程的设计步骤要求，以及网站的发布与维护、网站的主机 方案等相关知识。.2 Dreamweaver 8 简介Dreamweaver是美国Adobe 原Macromedia，2005年被Adobe收购 公司开发的集网页制作和管理网站于一身的所见即
5、所得网页编辑器，它是第一套针对专业网页设计师特别开展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。它不仅是优秀的WYSIWYG编辑器，更是优秀的代码编辑器，有代码加亮，代码提示等丰富功能，提供各种例如代码，并支持Javascript,PHP,ASP,JSP等多种脚本语言。最新版本为CS5，发布于2021年4月Dreamweaver 是在网页设计与制作领域中用户最多、应用最广、功能最强大 的软件，随着 Dreamweaver 8 的发布，更坚决 Dreamweaver 在该领域的地位。它 集网页设计、网站开发和站点管理功能于一身，具有可视化、支持多
6、平台和跨浏 览器的特性，是目前网站设计、开发、制作的首选工具。突出的特点主要有灵活 的编写方式；可视化编辑界面；功能更多的 CSS 支持CSS 可视化设计、CSS 检查工具； 动态跨浏览器验证； 强大的 WEB 站点管理功能； 内建的图形编辑引擎； 丰富的媒体支持能力等。它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起，其功能 强大， 使得各个层次的开发人员和设计人员都能够快速创立界面吸引人的基于标 准的网站和应用程序。开发人员可以使用 Dreamweaver 及所选择的效劳器技术 来创立功能强大的 Internet 应用程序，从而使用户能连接到数据库、Web 效劳 和旧式系统。开发
7、环境支持 HTML、ASP、ASP.NET、JSP 等，提供众多功能强大的 可视化设计工具、应用开发环境以及代码编辑支持。主要用于素材整理、排版以 及后台程序的交互。3 HTML简介全称：HyperText Mark-up Language 译称：超文本标记语言。 简意：一种为普通文件中某些字句加上标识的语言，其目的在于运用标记 tag合文件 到达预期的效果。 HTML 是在 SGML 定义下的一个描述性的语言，或可说 HTML 是 SGML 的一 个应用程式。HTML 不是程式语言，如 C+ 和 Java 之类，它只是标记语言， 根本上你只要明白了各种 标记的用法便算学懂了 HTML， HT
8、ML 的格式非常简单， 只是由文字及标记组合而成，于 编辑部方面，任何文字编辑器都市可以，只要 能将档案存为文本格式即可， 用专门的网页编辑工具当然更好。HTML其实是文本，它需要浏览器的解释，HTML的编辑器大体可以分为三种， 1 根本编辑软件，使用自带的记事本或写字版都可以编写，当然，如果你用来编写，也可以。不过存盘作为扩展名，这样浏览器就可以解释执行了。 2 半所见即所得软件，这种软件能大大提高开发效率，它可以使你在很短的时间内做出Homepage，且可以学习HTML，这种类型的软件主要有HOTDOG，还有国产的软件网页作坊。 3 所见即所得软件，使用最广泛的编辑器，完全可以一点不懂HT
9、ML的知识就可以做出网页，这类软件主要有Frontpage98，DREAMWEAVER。设计HTML语言的目的，是为了能把存放在一台中的文本或图形，与另一台电脑中的文本或图形方便地联系在一起，形成有机的整体。人们不用考虑具体信息是在当前电脑里还是在网络上其它电脑里，只需使用鼠标在某一文档中点取一个，Internet就会马上转到与此图标相关的内容上去。而这些信息可能存放在的另一台电脑中。 另外，HTML是网络的通用语言，一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他人浏览到，无论使用的是什么类型的电脑或浏览器。神奇吗？一点都不神奇，因为现
10、在你看到的就是这种语言写的页面！HTML3.0标准是由当时刚成立的W3C于1995年3月提出，提供了很多新的特性，例如表格、文字绕排和复杂数学元素的显示。虽然它是被设计用来兼容2.0版本的，但是实现这个标准的工作在当时过于复杂，在草案于1995年9月过期时，标准开发也因为缺乏浏览器支持而中止了。3.1版从未被正式提出，而下一个被提出的版本是开发代号为Wilbur的HTML 3.2，去掉了大局部3.0中的新特性，但是参加了很多特定浏览器，例如Netscape和Mosaic的元素和属性。HTML对数学公式的支持最后成为另外一个标准MathML。HTML 4.0同样也参加了很多特定浏览器的元素和属性
11、，但是同时也开始“清理这个标准，把一些元素和属性标记为过时的，建议不再使用它们。HTML的未来和CSS结合会更好。TML4.01的新突破1997年 HTML 3.2版已经极大丰富了HTML功能。1997年12月推出HTML 4.0版将HTML语言推向一个新高度，该版本倡导了两个理念。1将文档结构和显示样式别离；2更广泛的文档兼容性。由于同期CSS层叠样式表的配套推出，更使得HTML和CSS对于网页制作的能力到达前所未有的高度。1999年12月，W3C网络标准化组织推出改良版的HTML4.01，该语言相当成熟可靠，一直沿用至今。HTML4.01相比先前的版本在国际化设置，提高兼容性，样式表支持，
12、以及脚本，打印方面都有所提高。.4 HTML 技术介绍在丰富多彩的世界里，必须由一种能支持这些功能的语言来描述， 这个语言就是的超文本标记语言HTMLHyperTextMarkup Languge。 Hyper 超级 Text 文本 Markup 标记 Language 语言 网页的作者必须按这种语言格式来书写自己的网页。HTML语言是 上的操作语言，读者在Web上的一切操作包括组织文件，建立 连接，发布消息等都依靠HTML语言来完成。 HTML文件使用 .html或.htm做扩展名。其主要特征是在文本中有HTML 标注符TAG,通过这些标注符把文档划分成不同的局部结构。 HTML语言的优点是
13、标注简单明了，功能强大。可以定义文件的显示格 式，标题，字型，表格，窗口等；与上任一资料进行超级链接； 可以使用辅助应用程序，参加图象、视频、声频等多媒体资料。 HTML语言的特点 HTML是一个纯文本文档，但是与普通纯文本文档相比，HTML文档具 是一个纯文本文档，但是与普通纯文本文档相比， 是一个纯文本文档 文档具 有经下特点： 有经下特点： 1结构化 结构化 HTML文档中使用各种标记来标注文档的不同逻辑单元，故HTML文档具 有特定的逻辑结构，是一种结构化的文本文档 2超文本 超文本 HTML文档中一般会有许多指向HTML文档以及指向图像、动画、音频、 视频等多媒体信息的超链接，因此H
14、TML文档是一种超文本文档。 3平台无关性跨平台 平台无关性 平台无关性 跨平台 HTML语言做为Web上通用的信息描述语言，把分布广泛的不同类型的 信息资源连在一起，为各种机器平台提供了一个公开的标准接口，因此 HTML文档可以应用在各种不同平台之上。 4简单易维护 简单易维护 HTML语言易学易用，创作HTML文档的过程简单，HTML语言版本的开 发采用向后兼容的方式，新的版本一般是原有版本的超集，从而使 HTML文档容易维护。 HTML发布过程 是一个典型的浏览器效劳器 BrowerServer 结构，即在存放 信息的机器上运行一个称为Web效劳器的软件，而在进行信息查 询的用户机器上运
15、行一个客户软件，即Web浏览器。 Web浏览器的主要功能是解释并显示由Web效劳器传送来的由 HTML语言写成的文档，包含嵌入在HTML语言中的GIF和JPEG 格式的图像，此外浏览器还可以根据用户的需要配置某些辅助应 用程序H elper Application来处理嵌入在HTML文档中的声 音，视频等外部多媒体信息。2.5 网站运行环境 配置要求：CPU Intel 或兼容机 Pentium 166Mhz 或以上企业版：至少 64M 建议 128M 或更多内存 标准版：至少 512M开发版：至少 512M 硬盘硬盘 Service：至少 80G，一般为 160GEnglish Query：
16、80M 显视器VGA 或更高分辨率在进行一个网站工程开发之前，应对这一开发工程进行了需求分析，以确定 网站开发者需要完成哪些工作才能满足用户的需求。系统概述在现今的信息共享的时代， 网络信息化管理工作系统经信息量大、 数据准确、 速度快、管理工作全面等特点在现实生活中得到广泛地应用。互联网商业的普及 应用已经成为网络经济的大势所趋。.2 系统的可行性分析实用性 网站的宗旨是根据用户需求的的详细信息， 2 技术性 网站提供3 经济性 网站能够提供应致力于推广的企业或者个人来到达所能到达的经 济效益，并且能够到达预期的推广效果。.1 网站的 网站结构图根据网站的根本功能需求,完本钱网站的根本结构，
17、网站主要分 为：首页，个网站页面。结构图 -1 所示： 网站的风格主页由标准模式构建，其主色调为，通过导航条的引导可以一步一步解网站内容 图 4-2 首页上半图首页是采用dw进行排版和编辑。采用的是表格和div层进行定位，背景图片在div层中固定于中间.整个网页的内容也相应的固定在中间，起到了一个居中的作用，背景颜色背景颜色在属性中设为的是橙色标题栏上面采用的是滚动字背景图片用div层固定滚动字代码如下： marquee height 40 width 50% bgcolor #ffffff span class STYLE95 冬季健康饮食-吃好，喝好！ 标题栏是用表格和div层固定住，表格
18、采用了css,鼠标滑过是是透明效果.当鼠标滑过某个菜单时，该单元格的颜色为#999999，移开立即恢复。插入了一个flash动画，播放新的菜式让人能够一目了然，主要起到了一个图片浏览的效果。左中今日推荐菜谱和健康饮食同样用div层和表格固定住，表格边框为1，边框颜色为#FFFFFF，点击表格中的图片会链接到图片所对应更详细的介绍 图4-3 首页下半图热门菜谱，热门分类，百宝箱采用的是div层，DIV元素是用来为HTML文档内大块block-level的内容提供结构和背景的元素。DIV的起始标签和结束标签之间的所有内容都是用来构成这个块的，其中所包含元素的特性由的属性来控制，或者是通过使用样式表
19、格式化这个块来进行控制。 script type text/JavaScript !- var p,i,x; if !d d document; if p n.indexOf ? 0&path d parent.framesn.substring p+1 .document; n n.substring 0,p ; if ! x dn &d.all x d.alln; for i 0;!x&i th;i+ x d.formsin; for i 0;!x&d.layers&i th;i+ x MM_findObj n,d.layersi.document ; if !x & d.getEleme
20、ntById x d.getElementById n ; return x; var i,p,v,obj,args MM_showHideLayers.arguments; for i 0; i args.length-2 ; i+ 3 if obj MM_findObj argsi ! null v argsi+2; if obj.style obj obj.style; v v show ?visible: v hide ?hidden:v; obj.visibility v; var i,j 0,x,a MM_swapImage.arguments; document.MM_sr ne
21、w Array; for i 0;i a.length-2 ;i+ 3 if x MM_findObj ai ! null document.MM_srj+ x; if !x.oSrc x.oSrc x.src; x.src ai+2; var d document; if d.images if !d.MM_p d.MM_p new Array ; var i,j th,a MM_preloadImages.arguments; for i 0; i a.length; i+ if ai.indexOf # ! 0 d.MM_pj new Image; d.MM_pj+.src ai; va
22、r i,x,a document.MM_sr; for i 0;a&i a.length& x ai &x.oSrc;i+ x.src x.oSrc; /- div id Layer48 table width 100% height 45 td width 13%class bb STYLE104 onmouseover this.className aa onmouseout this.className bb div align center span class STYLE106 a href ./index.html span class STYLE104 a href ./inde
23、x.html style type text/css .aa background-color:#999999; color:#E44C04;filter: alpha opacity 50 .bb background-color:#E44C04; color:#ffffff span class STYLE106 a href index.html 主页 td width 15%class bb onmouseover this.className aa onmouseout this.className bb div align center a href 美食菜谱/1-2.html c
24、lass STYLE106 美食菜谱 td width 12%class bb onmouseover this.className aa onmouseout this.className bb div align center a href 饮食资讯/y1.html class STYLE106 饮食资讯 td width 15%class bb onmouseover this.className aa onmouseout this.className bb div align center a href 美食视频/1.html class STYLE104 美食视频 td width
25、 15%class bb onmouseover this.className aa onmouseout this.className bb div align center a href 美食专题/1.html class STYLE104 美食专题 td width 15%class bb onmouseover this.className aa onmouseout this.className bb div align center a href 餐厅餐馆/1.html class STYLE104 餐厅餐馆 td width 15%class bb onmouseover thi
26、s.className aa onmouseout this.className bb div align center span class STYLE16 a href 餐饮人才/1.html 餐饮人才 div id Layer24 table width 858 height 147 border 0.5 td class STYLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 2 title 乌发 target _blank class STYLE63 hidefocus hideFocus 乌发 td class S
27、TYLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 3 title 丰胸 target _blank class STYLE63 hidefocus hideFocus 丰胸 td class STYLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 4 title 减肥 target _blank class STYLE65 hidefocus hideFocus 减肥 td class STYLE44 div align left class STYLE6
28、3 ? a href Ms_kind.asp?kid 5 title 增肥 target _blank class STYLE63 hidefocus hideFocus 增肥 td class STYLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 6 title 补阳 target _blank class STYLE63 hidefocus hideFocus 补阳 td class STYLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 8 title
29、 防暑 target _blank class STYLE63 hidefocus hideFocus 防暑 td class STYLE44 div align left class STYLE63 ? a hidefocus hideFocus title 脚气 href Ms_kind.asp?kid 9 target _blank 脚气 td class STYLE44 div align left class STYLE63 ? a hidefocus hideFocus title 祛痱 href Ms_kind.asp?kid 10 target _blank 祛痱 td cla
30、ss STYLE44 div align left class STYLE63 ? a hidefocus hideFocus title 冻疮 href Ms_kind.asp?kid 11 target _blank 冻疮 td class STYLE44 div align left class STYLE63 ? a hidefocus hideFocus title 祛痰 href Ms_kind.asp?kid 12 target _blank 祛痰 td class STYLE44 div align left class STYLE63 ? a href Ms_kind.asp
31、?kid 14 title 头痛 target _blank class STYLE63 hidefocus hideFocus 头痛 td class STYLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 15 title 解酒 target _blank class STYLE63 hidefocus hideFocus 解酒 td class STYLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 16 title 保胎 target _blank c
32、lass STYLE63 hidefocus hideFocus 保胎 td class STYLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 17 title 安胎 target _blank class STYLE63 hidefocus hideFocus 安胎 td class STYLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 18 title 延缓衰老 target _blank class STYLE63 hidefocus hideFoc
33、us 延缓衰老 td class STYLE44 div align left class STYLE63 a hidefocus hideFocus title 神经衰弱 href Ms_kind.asp?kid 20 target _blank ? span class STYLE63 神经衰弱 td class STYLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 21 title 补虚养身 target _blank class STYLE63 hidefocus hideFocus 补虚养身 td class ST
34、YLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 22 title 壮腰健肾 target _blank class STYLE63 hidefocus hideFocus 壮腰健肾 td class STYLE44 div align left class STYLE63 ? a href Ms_kind.asp?kid 23 title 清热解毒 target _blank class STYLE63 hidefocus hideFocus 清热解毒 td class STYLE44 div align left cla
35、ss STYLE63 ? a href Ms_kind.asp?kid 24 title 产后调理 target _blank class STYLE63 hidefocus hideFocus 产后调理 div align center class STYLE44 div align left ?红烧鱼 div align center class STYLE44 第五章 网站的测试与维护网站建成后并不意味着网站建设的结束，网站内容需要不断更新， 并且网站 发布前要进行细致周密的测试，以保证正常浏览和使用。主要测试内容：1、效劳器稳定性、平安性。 2、程序软件的测试。 3、网页兼容性测试，如
36、浏览器、显示器。 4、根据需要的其他测试。网站发布后也要定时的对网站进行维护，以保证网站的正常浏览和使用。主要的 维护内容有： 1 、效劳器及相关软硬件的维护，对可能出现的问题进行评估， 制定响应时间。 2 、数据库维护，有效地利用数据是网站维护的重要内容，因 此数据库的维护要受到重视。 3 、内容的更新、调整等。 4 、制定相关网站 维护的规定，将网站维护制度化、标准化。第六章 结论实践是检验真理的唯一标准，当然也是检验学习成果的标准。通过这次毕业 设计让我对前面学过的许多课程有了更为深刻的理解， 也是我对这三年所学的东 西的一个综合表达。然而这次设计让我感受颇深，它让我体会到了理论知识结合
37、 实践的重要性，光有理论知识是远远不够的。首先，我选的课题是旅游网站设计，随之而来的就是我如何来确定该网站的 主题,起初自己把问题想的过于简单了，总觉得只要我把主题给确定了，其他的 事情也就好解决了。然而却远远不是我想的那样，当我确定了主题着手来做时， 发现自己根本不知从哪着手，到底用什么来布局网站，网站的整体风格又是怎样 的，如何来规划等这一系列的问题都是我极需要解决的。我开始变得有点急躁不 安，带着这样的心情来做我的设计，其结果是几天下来网站的整体布局都还没有 一个统一的概念。慢慢的我就静下心来反思自己这几天所做的，发现自己的方法 完全错了，太急于求成，然后我整整自己思绪，一步步来，先准备
38、资料，画出网 站的设计模型图，熟悉编程环境，把握整体布局，明确了网站的根本功能，做好 业务流程图、数据流图的情况下，在设计好系统各主要局部，将一些细节问题考 虑周全后才开始动手进行开发，使得后来的工作才得以顺利进行。 其次，因编程语言的熟悉程度不够也让我对整个开发过程受到了一定的阻 碍。由于自己所学的东西不是很扎实，而以前只编辑过一些小的程序，对编辑大 型程序不是很了解，所以自己只有去找资料，图书馆和网络给了我很大的帮助， 在我徜徉书海和网络查找资料的日子里，面对无数书本和网上信息的罗列，自己 有时也会感到烦躁不安，但每当自己找到了自己想要的资料时，冲动和兴奋接踵 而至，心里满满的只有喜悦毫无
39、疲惫，这段旅程看似荆棘密布，实那么蕴藏着无尽 的宝藏，让自己了解和学习了很多以前自己根本就不知道的知识。 最后，在撰写毕业论文时也遇到了一些困难。由于这是我第一次写毕业论文， 没有任何经实践对于论文的格式、要求和内容都一无所知，在查询了大量的书籍 后才有了模糊概念。所以在此篇毕业论文中不免会有些缺点。 总的来说，这次的毕业设计为我即将踏入社会之前提供了一次锻炼的舞台。正像辅导老师说的一样，它让我对几年来所学的专业课有了更为深刻的认识，使知识得到了融会贯穿，得到了比以往学习任何一门课都更大的提高和进步。所谓 活到老学到老，自己以后还要加强知识的学习，不断的完善自己。经过开发这个 系统，这不仅仅是
40、一次毕业设计，不仅仅是学会了一门开发语言，更重要的是在 学习的过程中，脚踏实地，认真严谨，实事求是的学习态度，不怕困难、坚持不懈、吃苦耐劳的精神是我在这次设计中最大的收益。我想这是一次意志的磨练， 是对我实际能力的一次提升，也会对我未来的学习和工作有很大的帮助。 这次毕业设计不能说得上是完美，但我觉自己已经尽了自己最大努力去完 成，我想只要自己努力了就能对得起自己了。同时我也会在以后的时间里尽量的 完善它，不断的对它进行升级，做出更好的成绩。在做毕业设计的近几个月时间是我学生生涯中最有价值的一段时光。 这里有治学严谨而 不失亲切的老师，又相互帮助的同学，更有向上、融洽的学习生活气氛。借此论文之
41、际， 我想向所以人表示我的谢意。 首先。本论文是在老师的指导下修改完成的。再次，要多他们的细心帮助和指导表示由衷的感谢。在这段时间里，我从她们的身上不仅学到了多的专业知识， 更感受到了她们工作中的兢兢业业，在生活中的平易近人。此外，她们严谨的治学态度和 忘我的工作精神值得我去学习。 还要感谢给予我帮助的我，他们在我的毕业设计中经常给我提 出许多关键性的问题，使我受益匪浅 感谢三年来传授我知识的老师们，更要感谢我的家人对我学业上的主持和鼓励，感 谢所有关心帮助过我的人，同时感谢大家，感谢。 总之，在以后的学习生活中我将以加倍努力工作队给予我帮助的学校老师及同学们的回报参考文献1：杨选辉编著网页设
42、计与制作教程清华大学出版社2：李舒亮主编网页设计与制作使用教程机械工业出版社2006年8月第一 版3：中文版 Dreamweaver CS4 案例教程 1CD 龙腾科技出版2021年5月第一 版4： 洪光希敏编著静态网站建设大连理工出版社2021年6月第二版5：姜伟主编网页美工传奇机械工业出版社2004年5月第一版6：方晨主编Fireworks8中文版实例教程上海科学出版社2006年6月第一版7：于慧主编静态网页编程精彩案例教程电子工业出版社2006年1月第一版8：胡崧主编HTML代码效果比照学习中国青年出版社2021年4月第一版16成 绩： 中华美食网首页饮食资讯餐饮人才餐厅餐馆美食专题美食视频美食菜谱图 4-1 中华美食网总体结构图