制作网页实验报告

时间:2024.4.13

XX大学

课程设计报告

课程名称  计算机网络     

设计题目 网页制作                     

       专    业                           

学生姓名                           

学生学号:                             

指导教师:                     

20##年6月12日

目  录

一:实验目的…………………………………..........…………1

二:实验原理…………………………………..........…………1

三:实验过程...…………………………………………………1

四:设计框图……………………………………………...……7

五:网页截图..…………………………………………………8

五:程序..………………………………………………………9

七:实验收获………………………………….. ……………15


一.  实验目的

学会用HTML语言制作自己的网页,并且设置iis让别人可以浏览你的网页

二.实验原理

     IIS(Internet Infomation Server):Internet信息服务。它是一种Web服务,主要包括WWW

服务器、FTP服务器等。它使得在Intranet(局域网)或Internet(因特网)上发布信息很容

易。Windows 20## Advanced Server 上提供的为IIS 5.0。

     超级文本标记语言(HTML)是标准通用标记语言下的一个应用,也是一种规范,一种标准, 它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)。浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容,对书写出错的标记将不指出其错误,且不停止其解释执行过程,编制者只能通过显示效果来分析出错原因和出错部位。

二.  实验过程

① 设计网页:

    注意:(网页中用到的所有的图片、音乐都和网页放在同意文件夹下)

1.  下载软件Dreamweaver

我没有学过HTML语言,所以用软件来做要方便的多,也可以更好的制作出自己想要的网页

2.  利用Dreamweaver制作出3个网页,分别为主页,个人简历,个人收藏

 

3.把三个网页用链接联系起来

插入三个flash文本就行了

文本如下设置

主要需要设置的有2点:

l  文本:这里写上“主页”,告诉浏览者此链接的指向

l  链接:这里点击“浏览”,选上你制作的3个网页中的index.htm

l  对于其余两个链接是类似的设置,只要把“文本”栏的“主页”换成“个人简历”和“收藏”,对应的链接也换成制作的相应的网页即可

4.对每个网页都进行上个步骤的设置,这样无论在那个网页下你都可以通过点击flash文本跳转到相应的页面。

② IIS设置:

1、添加 IIS:

选“控制面板→添加/删除程序→添加/删除Windows组件→选Internet信息服务” ,然后选”下一步”,系统将自动完成。

2、打开 IIS管理器:选“开始菜单→程序→管理工具→Internet信息服务”。如下图:

3、设置“默认Web 站点”项:

“默认Web 站点”一般用于对应向所有人开放的WWW 站点,本网中的任何用户以无

限制地通过浏览器来查看它。

⑵       网站选项下拉,有个index选项,“index→右键→属性”打开属性窗。

⑶       置“Web 站点”:“IP地址”一栏选填入电脑的地址,如我的电脑地址为“192.168.1.111”;“TPC端口”维持原来的“80”不变。

⑷       设置“主目录”:在“本地路径”通过“浏览”按钮来选择你的网页文件所在的目录

路径最好是英文的,中文路径有时候会出问题。

⑷ 设置“文档”:确保“启用默认文档”一项已选中,再增加需要的默认文档名并相应调整

搜索顺序即可。此项作用是,当在浏览器中只输入域名(或IP地址)后,系统会自动

在“主目录”中按“次序”(由上到下)寻找列表中指定的文件名,如能找到第一个则调

用第一个;否则再寻找并调用第二个、第三个……如果“主目录”中没有此列表中的任

何一个文件名存在,则显示找不到文件的出错信息。

在浏览器中输入电脑地址“192.168.1.111”即可连接到主页

四.设计框图

 


五.网页截图

         

                                     

六.程序

● 主页的源程序:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>竹马的主页</title>

<style type="text/css">

<!--

body {

              background-image: url(5.jpg);

}

.STYLE1 {font-size: 14px}

.STYLE5 {font-size: large}

-->

</style></head>

<body>

<table width="1247" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td width="311" height="82" bordercolor="#99CC33" background="7.jpg" bgcolor="#FFCCCC"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="162" height="38">

      <param name="movie" value="text5.swf" />

      <param name="quality" value="high" />

      <param name="bgcolor" value="#FFCC99" />

      <embed src="text5.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="162" height="38" bgcolor="#FFCC99"></embed>

    </object></td>

    <td width="296" bordercolor="#99CC33" background="7.jpg" bgcolor="#FFCCCC"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="154" height="41">

      <param name="movie" value="text6.swf" />

      <param name="quality" value="high" />

      <param name="bgcolor" value="#FFCC99" />

      <embed src="text6.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="154" height="41" bgcolor="#FFCC99"></embed>

    </object></td>

    <td width="320" bordercolor="#99CC33" background="7.jpg" bgcolor="#FFCCCC"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="155" height="41">

      <param name="movie" value="text1.swf" />

      <param name="quality" value="high" />

      <param name="BGCOLOR" value="#FFCC99" />

      <embed src="text1.swf" width="155" height="41" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" bgcolor="#FFCC99"></embed>

    </object></td>

    <td width="320" bordercolor="#99CC33" background="7.jpg" bgcolor="#FFCCCC"><embed src="夏祭り、夢花火。.mp3" width="317" height="72" autostart="True" loop="-1"> </embed></td>

  </tr>

</table>

<p>&nbsp;</p>

 <table width="800" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td height="638" background="9.jpg"><p> </p>

      <p class="STYLE1">  <span class="STYLE5">你想用卖糖水来度过余生,还是想要一个机会来改变世界?</span></p>

      <p class="STYLE5">&nbsp;</p>

      <p class="STYLE5">  死亡很可能是唯一的、最好的生命创造。它是生命的促变者。它送走老一代,给新一代开出道路。</p>

      <p class="STYLE5">  </p>

      <p class="STYLE5">  你如果出色地完成了某件事,那你应该再做一些其他的精彩事儿。不要在前一件事上徘徊太久,想想接下来该做什么。</p>

      <p class="STYLE5">  </p>

      <p class="STYLE5">  佛教中有一句话:初学者的心态;拥有初学者的心态是件了不起的事情。</p>

      <p class="STYLE5">  </p>

      <p class="STYLE5">  是否能成为墓地里最富有的人,对我而言无足轻重。重要的是,当我晚上睡觉时,我可以说:我们今天完成了一些美妙的事。</p>

      <p class="STYLE5"> </p>

      <p class="STYLE5">  谨记自己总会死去,是让自己避免陷入“人生有所失”思考的最佳方法。</p>

      <p class="STYLE5"> </p>

      <p class="STYLE5">  你的时间有限,不要浪费于重复别人的生活。不要让别人的观点淹没了你内心的声音。</p>

      <p class="STYLE5"> </p>

      <p class="STYLE5">  要有勇气追随心声,听从直觉--它们在某种程度上知道你想成为的样子。其他事情都是其次的。</p>

      <p class="STYLE5">  </p>

    <p class="STYLE5">  人生短暂,过着过着你就没了,明白嚒?</p></td>

  </tr>

</table>

<p>&nbsp;</p>

<form id="form1" name="form1" method="post" action="">

</form>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

</body>

</html>                  

● 个人简历源程序:

<html>

 <head>

  <title>XX的个人简历</title>

 </head>

 <body>

  <table width="803" height="582" border="1" align="center">

   <tr height="50px">

    <td colspan="4" align="center" width="615" height="138">

    <p style="background-color: #00FF00">

    <font size="6" color="blue" style="font-family:楷体_GB2312:">

     <strong><u>XX的 resume</u></strong>

    </font>

    </p>

   </td>

   </tr>

   <tr height="60px">

    <td width="77" height="73">姓名</td>

    <td width="304" height="73">

      <p align="center">XX</p>

    </td>

    <td width="80" height="73">出生年月</td>

    <td width="136" height="73">1989.10.24</td>

    <td width="172"    rowspan="5" height="284">  <img src="111.jpg" width="150" height="180" /></td>

   

   </tr>

   <tr height="30px">

    <td width="77" height="67">学校&学院</td>

    <td width="304" height="67">湖北省武汉市江汉大学物理与信息工程学院</td>

  

   </tr>

   <tr height="30px">

    <td width="77" height="46">籍贯</td>

    <td width="304" height="46">中国.湖北.武汉</td>

   </tr>

   <tr height="30px">

    <td width="77" height="51">人生格言</td>

    <td width="304" height="51"><i><b>Just do it! Never give up!</b></i></td>

  

   </tr>

   <tr height="30px">

    <td width="77" height="50">人生愿望</td>

    <td width="304" height="50"><i>出人意料之外!</i></td>

   </tr>

   <tr>

    <td width="77" height="142">个人简历</td>

   <td width="304" height="50"><a href="http://192.168.0.58">友情链接@1 <br> <a href="http://192.168.0.55">友情链接@2</a></a>

</td>

 

   

 

  </table>

</html>

● 收藏源程序:

<style type="text/css">

<!--

body {

              background-image: url(5.jpg);

}

-->

</style>

<table width="1247" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td width="311" height="82" bordercolor="#99CC33" background="7.jpg" bgcolor="#FFCCCC"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="162" height="38">

      <param name="movie" value="text5.swf" />

      <param name="quality" value="high" />

      <param name="bgcolor" value="#FFCC99" />

      <embed src="text5.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="162" height="38" bgcolor="#FFCC99"></embed>

    </object></td>

    <td width="296" bordercolor="#99CC33" background="7.jpg" bgcolor="#FFCCCC"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="154" height="41">

      <param name="movie" value="text6.swf" />

      <param name="quality" value="high" />

      <param name="bgcolor" value="#FFCC99" />

      <embed src="text6.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="154" height="41" bgcolor="#FFCC99"></embed>

    </object></td>

    <td width="320" bordercolor="#99CC33" background="7.jpg" bgcolor="#FFCCCC"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="155" height="41">

      <param name="movie" value="text1.swf" />

      <param name="quality" value="high" />

      <param name="BGCOLOR" value="#FFCC99" />

      <embed src="text1.swf" width="155" height="41" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" bgcolor="#FFCC99"></embed>

    </object></td>

    <td width="320" bordercolor="#99CC33" background="7.jpg" bgcolor="#FFCCCC"><embed src="音乐.mp3" width="317" height="72" autostart="True" loop="-1"> </embed></td>

  </tr>

</table>

<p>&nbsp;</p>

<table width="1520" height="652" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td width="502" height="332"><img src="12.jpg" width="502" height="436" /></td>

    <td width="530"><img src="13.jpg" width="530" height="539" /></td>

    <td width="466"><img src="14.jpg" width="548" height="602" /></td>

  </tr>

  <tr>

    <td height="312"><img src="15.jpg" width="502" height="408" /></td>

    <td><img src="16.jpg" width="526" height="494" /></td>

    <td><img src="19.jpg" width="546" height="609" /></td>

  </tr>

</table>

七.实验收获

此次实验让我第一次做了一个自己的网站,有点小小的成就感,对超文本标记语言也有浅显的了解,对于初学者的我来说要做出一个排版简洁好看的网页还真是挺难的一件事情。有机会的话我会好好学习下HTML,制作出一个更好看的网页。这次使用的Dreamweaver软件做的网页,整体来说很不方便,特别是做表格的时候,不能随意移动,不能十分灵活的对表格进行处理。

更多相关推荐:
网页制作实训报告

《网页制作》课程实训说明书系(部):班级:姓名:指导教师:20**~20**学年第一学期摘要《网页制作》实训的目的主要是让我们通过这门实践课程的学习了解和掌握网页设计的基本方法,通过不断上机实习训练达到解决实际…

Dreamwever网页设计实验报告

学院计算机系综合性实验实验报告课程名称网页制作实验学期20xx至20xx学年第2学期学生所在系部计算机系年级20xx专业班级Z091学生姓名学号任课教师胡英实验成绩计算机系制华北科技学院计算机系综合性实验报告网...

网页制作实验报告

华北科技学院计算机系综合性实验实验报告课程名称网页制作A实验学期20xx至20xx学年第1学期学生所在系部计算机系年级大三专业班级信管B081班学生姓名尹芳学号20xx07034113任课教师沙嘉祥实验成绩计算...

网页制作大作业+网页制作实验报告

华北科技学院计算机系综合性实验实验报告课程名称网页制作实验学期20xx至20xx学年第一学期学生所在系部计算机系年级08级专业班级计算机应用技术一班学生姓名冀小伟学号20xx07013126任课教师邵铁君实验成...

网页设计实验报告

河南城建学院《网页制作》课程设计报告学号:专业:姓名:题目:指导教师:设计时间:计算机科学与工程系20##年6月目录一设计目的...3二、课程设计题目...3三、课程设计要求...3四、需求分析...4五、技术…

个人网页制作实验报告

湖南文理学院芙蓉学院个人主页课程设计报告课题:个人主页课程设计学号:**同组姓名:**专业班级:计算机科学与技术0901班设计时间:20XX年6月13日1、实验目的与要求(1)自主选择主题实现一个关于主题的个人…

简单网页制作实验报告

大学计算机基础专业名称学号xxxxxxxxxxx姓名xx指导教师xx实验报告20xx年12月24日目录第一章网站主题设计说明111主题内容112设计思路1第二章网站内容设计211链接1标题212链接2标题213...

网页制作实验报告

网页制作实验报告主题NBA的答案阿伦艾弗森课班级姓学号一实验目的网络在现今生活中的重要地位已经不言而喻我们上网都避免不了浏览网页本实验通过学习使用Dreamweaver8设计网页来达到熟知一个网站的网页整个设计...

网页设计实验报告

实验一熟悉环境与网页中站点的相关操作学号姓名日期1实验目的熟悉网页开发环境尤其是Dreamweaver掌握站点的相关操作和功用了解HTML的基本语法2实验环境WindowsXPDreamweaver3实验内容1...

大学计算机基础网页制作实验报告

网页制作报告计算机基础网页制作报告20xx913网页制作报告目录一制作目的3二制作内容3三遇到的问题及解决方案3四报告成果截图展示4五制作体会5网页制作报告一制作目的掌握Dreamweaver的基本操作掌握网页...

网页设计实验报告

网页设计技术实验报告姓名南志贤学号班级电气1001班学院电气与电子工程学院专业电气信息类教师刘文涛一实验任务书1目的和意义这是我做的第一次网站也是我第一次接触做网站做我的个人网页并不是仅仅为了完成老师布置的任务...

网页制作与网站设计实验报告

12345678910111213141516171819

网页制作实验报告(43篇)