Web个人网页设计实验报告.docx

郑州轻工业学院Web前端设计网页设计报告院系： 班级： 学号： 姓名： 时间： 设计报告网页设计要求题目：设计一个不限内容、题材的个人网站，要求页面数量不少于7个。具体要求1. 网页内容详实、科学、准确、积极、健康、活泼，网页文字及相关链接无错误。2. 网页文件及文件夹的命名符合要求，文件组织合理。1) 首页源文件命名为：index.html。2) 文件夹image存放与网页相关的图片、动画文件等。3) 说明文件Readme.txt内容包括：网页创意及制作的简单说明。3. 网页设计整体设计思路清晰，网页布局合理，风格明快、主题页和其他子页之间协调，主题分明、重点突出。栏目及版面设计，层次结构及链接结构明确，内容布局合理，图画运用得当，效果生动。4. 网页上各主题和附加图片、背景的色彩选配方案要注意做到：色彩柔和、搭配美观、朴素大方，不应过分夸张，使视觉疲劳。5. 使用表格、框架、Css各布局一个页面。6. 有自己创作的flash、JavaScript可加分。7. 文档提交：电子稿与报告（电子稿网站、报告网页创意及制作的简单说明）。网页主题及内容主题：在世界的各个角落，邂逅最美的你内容：一些著名的外国旅游、度蜜月胜地，感受当地的风土人情，体验不一样的异域风情。网页创意因为自己本身特别喜欢旅游，喜欢尝试不一样的生活环境，和每个少女一样，我也存在着一个和未来的另一半环游世界的梦，所以这次我的网页是以“在世界的各个角落，邂逅最美的你”为主题展开制作，在实现这个环游世界的梦以前，提前感受下各国的风土人情。网页制作的简单说明通过主页index可链接到 “马尔代夫的蓝色心情（Maerdaifu.html）、法国的紫色浪漫风情（French.html）、在雅典，我愿意带你，走遍阳光洒过的地方（XILA.html）、行走在巴黎（BaLi.html）、巴塞罗那（Basailuona.html）、ReadMe（ReadMe.html）”，所有图片都经过PS处理过。1.首页（index.htm）：采用了CSS布局页面。 1）创建了style1.css文件在style文件中。 2）插入的Div标签有：date标签，menu标签，main标签，make 标签。 3）在代码中插入了背景音乐。 4）menu标签中分别设置了5个超级链接。 5）插入了AP Div1显示歌词、AP Div2滚动歌词文字，并设 置了歌词栏的“显示-隐藏”。2. 马尔代夫的蓝色心情（Maerdaifu.html）：采用Spry选项卡式面 板+Ap层 布局。 1）采用spry选项卡式面板布局。 2）面板中设置了四个选项：马尔代夫简介+景点游玩及指南1+ 景点游玩及指南2+图片欣赏。 3）设置了AP Div1 - AP Div14个层。 4）AP Div8插入了滚动歌词，AP Div13插入滚动图片。 5）在代码中插入了背景音乐。3.法国的紫色浪漫风情（French.html）： 1）采用spry选项卡式面板布局。 2）面板中设置了五个选项：普罗旺斯简介+活动+主角(1)+主角 (2)+图片欣赏。 3）设置了AP Div2 - AP Div15几个层。 4）AP Div15插入了滚动歌词，AP Div12插入了滚动图片。 5）在代码中插入了背景音乐。4.在雅典，我愿意带你，走遍阳光洒过的地方（XILA.html）： 1）采用表格布局。 2）表格中设置了3个模块：伯罗奔尼撒半岛(Peloponissos)+ 圣托里尼岛(Santorini)+雅典(Athens)。 3）设置了AP Div2 - AP Div20几个层。 4）在代码中插入了背景音乐。5.行走在巴黎（BaLi.html）： 1）采用Ap层布局。 2）设置了AP Div1 - AP Div5几个层。 3）AP Div2 设置为滚动图片。 4）在代码中插入了背景音乐。6.巴塞罗那（Basailuona.html）： 1）采用spry选项卡式面板布局。 2）设置了AP Div1 - AP Div5几个层。 3）AP Div 3 设置为滚动图片。 4）在代码中插入了背景音乐。7.ReadMe（ReadMe.html）： 1）采用Ap层布局+表格布局。 2）设置了AP Div1 - AP Div2两个层。 3）AP Div2 设置为滚动字幕，并插入了日期。心得 通过Web前端设计网页设计的学习，我喜欢上了网页设计，