淮海工学院-HTML课程设计.doc

淮 海 工 学 院 计算机工程学院 课程设计报告 设计名称： 《win平台前台web应用课程实践 》 选题名称： win平台前台web应用 姓 名： 史祥平 学 号： 2014122877 专业班级： 软件工程 软件142 系 （院）： 计算机工程学院 设计时间： 2017.5.15~2017.5.24 设计地点： 计算机实验室、教室 成绩：指导教师评语： 成绩： 签名： 年 月 日 win平台前台Web应用课程实践设计报告 第 PAGE 1 页，共 页 1．课程设计目的 1、训练学生对HTML的认知 ，了解企业软件开发前台的基础技术知识 2、掌握HTML中最基础的标签使用，应用场景 3、掌握HTML中的DIV+CSS布局技术 4、通过实践，培养学生良好的编程习惯，独立编码能力。 2．课程设计任务与要求： 任务 本任务是贯穿了本次实训的所有章节内容。运用HTML的基本标签，盒子模型布局思想结合DIV+CSS布局技术实现开心网首页。 要求： 1.根据盒子模型思想结合DIV+CSS技术对页面进行合理的划分。 2．样式表一概使用外部样式，尽量避免样式冗余，做到样式具有复用性。 3、样式表中要有合理的区域性的注释，以便维护人员维护 4、HTML页面代码要有合理的缩进，代码要有层次。 3．课程设计说明书 一 需求分析 页面头部：可以使用float浮动实现，也可以使用元素的定位实现导航 。文字需要有超链接 页面的主体部分：全部游戏，游戏角色部分采用div ,dl dt dd标签进行布局实现。页面的图片以及文字均需要超链接。 页面的底部：采用div，ul li标签并使用float进行实现 二 概要设计 页面的布局部分 body div id=container div id=index_head /div div id=index_body div class=body_left div class=left_top div class=game_type /div div class=pic /div /div div class=game_all div class=all_type /div /div div class=left_bottom div class=role_type /div /div /div div class=body_right div class=right_top /div div class=right_body div class=game_type /div /div div class=right_bottom div class=news_type /div /div /div /div div id=index_bottom /div /div /body 三 详细设计 Head： div id=index_top ul class=index_type li/li li/li /ul ul class=top_menu li/li li/li li/li li/li /ul /div Body： div class=left_top div class=game_type ul liaimg//a/li liaimg//a/li liaimg//a/li liaimg//a/li liaimg//a/li liaimg//a/li liaimg//a/li liaimg//a/li /ul /div div cla