7网页设计报告.docVIP

存档资料 成绩：　 华东交通大学理工学院 课 程 设 计 报 告 书 所属课程名称 网页设计与制作 题 目 　 设计一个首页　　　　　　　　 　　　 分 院 电 信 分 院 　　 　 专业班级 12级信管1班 学　　号 　20120210450107　　　　 　　 　 学生姓名 　 孙 欢　　　 　　　 指导教师 魏 建 红 　　　 2014年12 华东交通大学理工学院课程设计报告 - PAGE 16 - 目　录 TOC \o 1-2 \h \z \u 第一章 课程设计内容及要求 3 第二章 设计思路与步骤 4 第三章 详细设计 5 第四章 程序分析 15 第五章 课程设计心得 16 第六章　参考文献（资料） 16 第一章 课程设计内容及要求 内容有： 1．建立站点； 2．结构分析； 3．搭建框架； 4．切割效果图； 5．布局页面——头部和导航； 6．布局页面——侧边栏； 7．布局页面——主体部分； 8．底部和细节调整。 要求：用DW进行设计； 第二章 设计思路与步骤 1、设计目的： 本学期通过对《网页设计与制作》的学习，让我了解了如何设计网页，以及一些基础的网页设计知识，运用一些基本的网页设计工具和原则制作和美观网页。比如背景图片，文字，超链接，布局，框架，多媒体等等。通过这次设计，进一步的提高了我的网站设计能力和动手能力，更加全面的巩固了我在课堂上学到的知识，熟练了网站设计的一些方法和步骤，了解了网站的基本结构，熟悉了规范和标准。 2、网页的主题 爱旅社首页(在线旅游网页) 3、网站规划 通过借鉴一些旅游网页，我主要是用div+css布局，背景图片，然后再插入超链接等等布局，就形成了一个简单的网站首页布局。 第三章 网页详细设计 3.1 效果展示图 1、头部分为两个部分，一个是头顶的图片，一个是导航 用如下代码实现： div style=margin-left:200px; img src=image/top2.jpg width=970px height=200px //div div id=nav ul lia href=#首页/a/li lia href=#游记分享/a/li lia href=#旅行攻略/a/li lia href=#约伴出行/a/li lia href=#旅行线路/a/li lia href=#爱旅之家/a/li /ul /div brbrbr div id=twoa当前位置...首页/div ul li { float:left; list-style:none; list-style:none; margin-left:80px; } #nav{ width:970px; height:50px; background-color: #1E90FF; margin-left:200px; float:left; } #twoa{ position:absolute; left:208px;top:260px; width:968px;height:30px; border:1px solid #0000E0; } 2、左侧栏通过div分成三块： a.会员登录界面： b.酒店安排： c.旅游指南： 整体通过一些图片的插入完善，就形成了一个简单的左侧栏： 如下代码实现： div id=one align=center form action=register.html method=post label用户名:/label input type=text name=usernamename/brbr label密nbsp码:/label input type=text name=usernamename/brbr input type=submit name=submit value=登录 /nbsp nbsp input type=submit name=submit value=注册/ /form /div div