计算机网络基础与实践应用项目导读项目导读 1基础知识基础知识 2任务操作任务操作3项目总结项目总结 4习题练习习题练习 5 项目六项目六 Web网站建设网站建设 项项目目六六 W We eb b网网站站建建设设 计算机网络基础与实践应用v课程分析课程分析v项目导读项目导读项目情景描述项目情景描述 随着信息技术的发展,网络已经日益融入到人们的随着信息技术的发展,网络已经日益融入到人们的生活、工作和学习中,在通过生活、工作和学习中,在通过InternetInternet获取信息的同获取信息的同时,时,人们也需要学习网站建设和网页制作的相关知识,人们也需要学习网站建设和网页制作的相关知识,建设新颖别致的网站和制作美观实用的网页建设新颖别致的网站和制作美观实用的网页项项目目六六 W We eb b网网站站建建设设 计算机网络基础与实践应用v课程分析课程分析v项目导读项目导读知识目标知识目标本项目主要让学生掌握简单的本项目主要让学生掌握简单的静态网页的制作方法以及创建静态网页的制作方法以及创建和维护和维护Web网站的基本过程网站的基本过程项项目目六六 W We eb b网网站站建建设设 计算机网络基础与实践应用v课程分析课程分析v项目导读项目导读技能目标技能目标项目的主要任务是:制作和发项目的主要任务是:制作和发布一张个人简历网页,要求学布一张个人简历网页,要求学生能独立完成任务的实施。
生能独立完成任务的实施项项目目六六 W We eb b网网站站建建设设 计算机网络基础与实践应用 v课程分析课程分析v项目知识结构项目知识结构 项项目目六六 W We eb b网网站站建建设设 知识点1:使用HTML制作网页知识点2:网页制作工具简介知识点3:网页动态效果的制作知识点4:Web网站的创建与维护任务1:个人简历网页的制作实践应用实践应用理论基础理论基础任务2:个人简历网页的发布计算机网络基础与实践应用v知识点知识点1:使用使用HTML制作网页制作网页 1.网页的基本概念网页的基本概念 所所谓谓网网页页就就是是在在浏浏览览器器上上看看到到的的一一幅幅幅幅画画面面,学学名名叫叫做做HTMLHTML文文件件,它它是是一一种种由由HTMLHTML语语言言编编写写,可可以以在在万万维维网网上上传传输输,并并被被浏浏览览器器识识别别翻翻译译成成页页面面显显示示出出来来的的文件下面介绍与网页相关的一些基本概念下面介绍与网页相关的一些基本概念WWWWWW:“World World Wide Wide Web”Web”的的缩缩写写,即即万万维维网网它它是是以以超超文文本本标标记记语语言言HTMLHTML与与超超文文本本传传输输协协议议HTTPHTTP为为基基础础,提供提供InternetInternet服务的信息浏览系统。
服务的信息浏览系统HTMLHTML:“Hypertext Hypertext Markup Markup Language”Language”的的缩缩写写,即即超文本标注语言超文本标注语言HTTPHTTP:InternetInternet上上传传输输超超文文本本或或超超媒媒体体信信息息的的协协议议,也是也是TCP/IPTCP/IP应用层协议之一应用层协议之一项项目目六六 W We eb b网网站站建建设设 计算机网络基础与实践应用v知识点知识点1:使用使用HTML制作网页制作网页 超超文文本本:就就是是指指页页面面内内除除了了可可以以包包含含文文字字外外,还还可可以以包包含含表表格格、图图像像、动动画画、链链接接,甚甚至至音音乐乐、视视频频、程序等非文字的元素程序等非文字的元素主主页页:一一般般一一个个网网站站是是由由很很多多的的WebWeb网网页页组组成成,其其中中有有一一个个比比较较特特殊殊的的WebWeb网网页页,它它是是当当InternetInternet网网络络用用户户访访问问这这个个网网站站时时所所显显示示的的第第一一张张WebWeb网网页页,称称作作主主页页(Home PageHome Page)。
它是网站的入口点,包含很多链接它是网站的入口点,包含很多链接WebWeb网网站站:一一个个庞庞大大的的文文件件集集合合体体,这这些些文文件件就就是是网网页页,它它们们存存储储在在InternetInternet上上的的成成千千上上万万台台计计算算机机上上提供网页的计算机称为提供网页的计算机称为WebWeb服务器或网站、站点服务器或网站、站点项项目目六六 W We eb b网网站站建建设设 计算机网络基础与实践应用v知识点知识点1:使用使用HTML制作网页制作网页 2.网页的分类网页的分类 网页主要可以分为两种类型:网页主要可以分为两种类型:(1 1)静态网页)静态网页 静态网页的内容是固定的,当我们修改静态网页时,哪怕只修静态网页的内容是固定的,当我们修改静态网页时,哪怕只修改了网页中的一个字符或一个图片,都要重新上传一次覆盖原来的改了网页中的一个字符或一个图片,都要重新上传一次覆盖原来的页面静态网页的访问者只能被动地浏览网站建设者提供的网页内页面静态网页的访问者只能被动地浏览网站建设者提供的网页内容,不能实现与网页内容之间的交互,网页不能根据用户的选择调容,不能实现与网页内容之间的交互,网页不能根据用户的选择调整返回给用户的内容。
整返回给用户的内容2 2)动态网页)动态网页 动态网页是指在服务器端运行的脚本程序或者网页,它们会随动态网页是指在服务器端运行的脚本程序或者网页,它们会随不同客户、不同时间返回不同的内容动态网页中的内容可以自动不同客户、不同时间返回不同的内容动态网页中的内容可以自动生成,当不同的时间、不同的人访问同一网址时会产生不同的页面生成,当不同的时间、不同的人访问同一网址时会产生不同的页面效果,在浏览器端显示出来的内容其实是服务器端程序运行的结果效果,在浏览器端显示出来的内容其实是服务器端程序运行的结果动态网页一般通过数据库进行架构,可以大大降低网站维护的工作动态网页一般通过数据库进行架构,可以大大降低网站维护的工作量项项目目六六 W We eb b网网站站建建设设 计算机网络基础与实践应用v知识点知识点1:使用使用HTML制作网页制作网页 3.网页制作语言网页制作语言HTML HTMLHTML是是一一种种描描述述文文档档结结构构的的标标注注语语言言,它它使使用用一一些些约约定定的的标标记记对对WWWWWW上上的的各各种种信信息息进进行行标标注注当当用用户户浏浏览览WWWWWW上上的的信信息息时时,浏浏览览器器会会自自动动解解释释这这些些标标记记的的含含义义,并并按按照照一一定定的的格格式式在在屏屏幕幕上上显显示示这这些些被被标标记记的的文文件件。
HTMLHTML的的优优点点是是其其跨跨平平台台性性,即即不不管管其其操操作作系系统统是是什什么么,任任何何可可以以运运行行浏浏览览器器的的计算机都能阅读并显示计算机都能阅读并显示HTMLHTML文件,并且显示结果相同文件,并且显示结果相同1 1)HTMLHTML语言的结构语言的结构 其实其实HTMLHTML并不是一种真正意义上的语言,它只是一些用来描述文本信并不是一种真正意义上的语言,它只是一些用来描述文本信息属性的标识符的集合,这些标识符称为息属性的标识符的集合,这些标识符称为HTMLHTML标记(标记(tagtag)从结构上讲,)从结构上讲,HTMLHTML文档由元素(文档由元素(elementelement)组成,组成)组成,组成HTMLHTML文档的元素有许多种,用于组文档的元素有许多种,用于组织文件的内容和指导文件的输出格式绝大多数元素都有一个起始标记和织文件的内容和指导文件的输出格式绝大多数元素都有一个起始标记和一个结束标记,在起始标记和结束标记中间的部分是元素体元素的标记一个结束标记,在起始标记和结束标记中间的部分是元素体元素的标记要用一对尖括号括起来,并且结束标记总是在开始标记前加一个斜杠,如:要用一对尖括号括起来,并且结束标记总是在开始标记前加一个斜杠,如:Welcome!Welcome!。
元素可以有自己的相关属性,每一个属性还可以元素可以有自己的相关属性,每一个属性还可以赋一定的值元素属性出现在起始标记的赋一定的值元素属性出现在起始标记的内,并且和元素名之间有一个内,并且和元素名之间有一个空格分隔,属性值用空格分隔,属性值用“”“”引起来,如:引起来,如:BODY Welcome!=Yellow Welcome!项项目目六六 W We eb b网网站站建建设设 计算机网络基础与实践应用v知识点知识点1:使用使用HTML制作网页制作网页 任何一个任何一个HTMLHTML文档都是以文档都是以开头,以开头,以结束,中间部分包括:结束,中间部分包括:标头区:用标头区:用和和定义,主要用来定义在浏览器的标题栏中显示定义,主要用来定义在浏览器的标题栏中显示的文件标题名称(的文件标题名称(TitleTitle)和设定与该文件有关的属性参数和设定与该文件有关的属性参数主体区:用主体区:用和和定义,网页中的主体内容都应该写在主体区中定义,网页中的主体内容都应该写在主体区中元素有下列常用属性:元素有下列常用属性:bgcolorbgcolor属性:用来设定属性:用来设定HTMLHTML文档的背景颜色,颜色可以用文档的背景颜色,颜色可以用6 6位十六进制位十六进制红红-绿绿-蓝(蓝(red-green-bluered-green-blue,RGBRGB)值或者其英文名称来表示。
如:)值或者其英文名称来表示如:bgcolorbgcolor=Yellow=Yellow或或bgcolorbgcolor=#FFFF00=#FFFF00backgroundbackground属性:用来指定属性:用来指定HTMLHTML文档的背景图片,可以使用的图片格式文档的背景图片,可以使用的图片格式为为GIFGIF、JPGJPG如:background=images/background=images/bg.gifbg.giftexttext属性:用来设定属性:用来设定HTMLHTML文档的正文文字颜色,如:文档的正文文字颜色,如:text=“Red”text=“Red”或或text=“#FF0000”text=“#FF0000”texttext元素定义的颜色将应用于整篇文档元素定义的颜色将应用于整篇文档linklink、vlinkvlink、alinkalink属性:分别用来设定普通超级链接、访问过的超级属性:分别用来设定普通超级链接、访问过的超级链接、当前活动超级链接的颜色链接、当前活动超级链接的颜色leftmarginleftmargin和和topmargintopmargin属性:分别用来设置网页主体内容距离网页左属性:分别用来设置网页主体内容距离网页左端和顶端的距离,如:端和顶端的距离,如:leftmarginleftmargin=20=20,topmargintopmargin=30=30。
项项目目六六 W We eb b网网站站建建设设 计算机网络基础与实践应用v知识点知识点1:使用使用HTML制作网页制作网页 项项目目六六 W We eb b网网站站建建设设 常见颜色的常见颜色的RGBRGB代码代码颜色色RGBRGB颜色色RGBRGB黑色(黑色(BlackBlack)#000000#000000橄橄榄色(色(OliveOlive)#808000#808000红色(色(RedRed)#FF0000#FF0000深表色(深表色(TealTeal)#008080#008080绿色(色(GreenGreen)#008000#008000灰色(灰色(GrayGray)#808080#808080蓝色(色(BlueBlue)#0000FF#0000FF深深蓝色(色(NavyNavy)#000080#000080白色(白色(WhiteWhite。