毕业设计 基于html5和css3.0的手机网站的设计与实现.docVIP

本科生毕业论文（设计） 题 目：基于HTML5和CSS3.0的手机网站的 设计与实现 专业代码： 作者姓名： 学 号： 单 位： 传媒技术学院 指导教师： 2015 年 5 月 1 日  原创性声明 　　本人郑重声明：所提交的学位论文是本人在导师指导下，独立进行研究取得的成果。除文中已经注明引用的内容外，论文中不含其他人已经发表或撰写过的研究成果，也不包含为获得聊城大学或其他教育机构的学位证书而使用过的材料。对本文的研究做出重要贡献的个人和集体，均已在文中以明确方式标明。本人承担本声明的相应责任。 学位论文作者签名：　　　　　　　日期　 　　 指 导 教 师 签 名：　　　　　　 日期　　 　 摘 要 随着智能手机的普及，越来越多同学使用手机上网。本研究基于已有的学院网站在手机上显示会出现字迹小，显示不全的问题，利用HTML5和CSS3.0等技术设计和实现手机版网站，该网站具有界面友好、功能清晰、支持跨平台、跨媒体浏览等特点，较好的满足了同学使用手机浏览学院网站信息的需求。本研究所采用的网页设计和关键技术也可以为其他手机网站的设计和开发提供参考和借鉴。 关键词：HTML5；CSS3.0；JavaScript；JQuery；网页设计 Abstract With the popular of the smartphone, more and more students use it online. This study is based on website which has already been founded having many problems,such as font-size, content show and so on. I will use HTML5 and CSS3.0 technologies to design and make website which can be presented perfectly in the smartphone. It has a friendly interface, clear function, support cross-platform and cross-media browsing, better meet the actual demand of using smartphone to skim the message about our college website. The web page design and the key technology which the research adopted can also provide a reference for other website design and exploitation. Key words: HTML5; CSS3.0;JavaScript; JQuery; web page design 目录 引言 1 第1章 需求分析 2 1.1 功能需求分析 2 1.2环境需求分析 3 1.3用户界面需求分析 4 第2章 网站设计 5 2.1网站首页的设计 6 2.2网站栏目页的设计 6 2.3网站内容页的设计 7 第3章 网站主要页面的设计开发及关键技术 8 3.1网站主要布局和文件头代码的实现 8 3.2CSS3.0实现页面的主要布局和匹配屏幕的大小 10 3.3JavaScript实现页面的交互和检测不同的设备 13 第4章 网站的测试与维护 14 4.1网站的测试 14 4.2网站的维护 15 结束语 16 参考文献 17 致谢 1 基于HTML5和CSS3.0的手机网站的设计与实现 引言 随着智能手机的发展，几乎所有的学生都配备了智能手机，这给学生开展移动学习带来了方便，但是传统的网站无法适应手机屏幕大小的要求，学生在浏览网页时会出现网页字迹太小，网站内容排版混乱等等问题，给学生的学习带来了一定的困扰。 HTML5是万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言的重大修改，基于HTML5开发的网页APP拥有更短的启动时间，更快的联网速度，而CSS3.0即层叠样式表， 在网页制作时采用层叠样式表技术，可以有效地对页面的布局、字体、颜色、背景和