网站设计实验报告.docx
《网站设计实验报告.docx》由会员分享，可在线阅读，更多相关《网站设计实验报告.docx（17页珍藏版）》请在冰豆网上搜索。
网站设计实验报告
院系：
计算机科学学院
专业：
年级：
课程名称：
网站管理与设计
学号：
姓名：
指导教师：
2012年5月25日
实验名称
实验一Web服务器的配置
实验二HTML、Dreamweaver、CSS+DIV简单网页制作
实验
类型
设计型
综合型
创新型
√
实
验
目
的
或
要
求
1.熟悉Web的工作原理
2.学习Web服务器的配置（Xampp或者Wamp的配置）
3.熟悉HTML、CSS、DIV
4.练习使用Dreamweaver8制作网页
5.掌握简单网页设计与制作的方法
实
验
原
理
（
操
作
步
骤
）
实验一：
Web服务器的配置
Web的工作原理：
1.在浏览器上用URL查询DNS，其将返回服务器的IP地址；2.在浏览器上用这个IP建立 一个TCP/IP连接；3.在浏览器上通过该连接向服务器HTTP请求；4.应于请求的内容，服务器找到对应的文件，根据文件的扩展名，形成一个MIME类型的HTTP应答，发送给浏览器，然后关闭连接；5.根据消息的头，浏览器按照某种方式显示该文件的内容。
Web服务器的配置步骤：
第一步：
在网上下载xampp服务器；
第二步：
安装xampp；
第三步：
使用XAMPP控制面板来启动/停止所有服务或安装/卸载所有服务，如下截图：
实
验
原
理
（
算
法
流
程
）
第四步：
在Apache服务启动后，在浏览器中输入地址http:
//localhost或http:
//127.0.0.1，并检测所有的XAMPP样例和工具，如下截图：
第五步：
检测Apache服务是否正常工作，可以通过左侧的导航条上的“状态”功能来查看，如下截图：
实
验
原
理
（
算
法
流
程
）
实验二：
HTML、Dreamweaver、CSS+DIV简单网页制作
HTML的特点：
1、简易性，HTML版本升级采用超集方式，从而更加灵活方便；
2、可扩展性，HTML语言带来了加强功能，增加标识符等要求，并采取子类元素的方式，为系统扩展带来保证；
3、平台无关性。
虽然PC机大行其道，但使用MAC等其他机器的大有人在，HTML可以使用在广泛的平台上。
CSS:
创建和编辑css常用的是AdobeDreamweaver系列软件，用于针对多种浏览器测试css的兼容性。
FrontPage2000有能为站点创建外部样式表的模板，可以用空白模板或已包含样式的模板来创建，保存样式表FrontPage会以css作为文件扩展名。
创建或修改网页样式时，可使用位于“格式”菜单的“样式”命令，FrontPage会自动创建嵌入的样式表，并在嵌入的样式表内将此样式保存为类选择器。
在网页上使用外部样式表的样式，可将该网页链接到样式表，方法是使用位于“格式”菜单上的“样式表连接”命令。
删除外部样式表中的样式，可在页面视图下打开样式文件，格式/样式命令，从打开的对话框中选择要删除的样式，单击“删除”。
DIV:
因为
是一个块级元素，所以它的内容会自动地开始一个新行。
固有的唯一格式表现就是换行。
可以通过
的class或id应用额外的样式。
可以对同一个
元素同时应用class和id属性，但更常见的情况是只应用其中一种。
这两者的主要差异是，class用于元素组，而id用于标识单独的唯一的元素。
实
验
原
理
（
算
法
流
程
）
相关代码如下：
///C|/Users/ausu/Pictures/ASUS壁纸/WWE/024.jpg"width="749"height="370"/>
///C|/Users/ausu/Desktop/WWE美摔100分-WWE美国职业摔角在线观看_files/logo.png"width="362"height="121"/>