网页第一讲培训课件

《网页第一讲培训课件》由会员分享，可在线阅读，更多相关《网页第一讲培训课件（67页珍藏版）》请在金锄头文库上搜索。

1、第一讲,主讲：宋海民,网页设计与网站建设,第1章 网页设计基础知识,1.1 Internet基础知识 1.2 HTML文档的基本结构,(一)、引入课题,教学进程,因特网上的信息都存放于网页上，网页设计是开发网站必须掌握的技术之一。 本节首先介绍一些与网页设计相关的基础知识。,教学目标： 1.掌握Internet基础知识； 2.掌握HTML文档的基本结构； 教学重点： 1. HTML文件的基本结构。 教学难点： 2. HTML元素、标记、属性及内容之间的关系。 通过以下几个问题的分析讨论，掌握以上教学目标。,1.1 Internet基础知识,Internet是什么意思？,Internet (即互

2、联网，也叫因特网)是将许多不同功能的计算机和网络通过线路连接起来的全球性网络, 通过它可以交换信息、共享资源，并以此为基础实现各种计算机通信应用项目。使Internet运行起来的协议是TCP/IP协议。,问题1,图表1-1八大骨干网络国际出口带宽数(截止2008.12.31),1.中国与Internet连接的八大骨干网,2.Inernet的特点,特点： (1).数据传输采用 分组交换技术； (2).通信语言采用 TCP/IP协议 TCP:传输控制协议 IP :网际协议,采用TCP/IP协议进行“对话”,3.Inernet提供的服务,(1).浏览万维网（WWW） (2).收发电子邮件(E-mai

3、l) (3).传输文件（FTP） (4).远程登录（Telnet） (5).使用电子公告板（BBS） (6).网上聊天（QQ） (7).网上购物等,图表1-2 2000-2008年中国网民规模与增长率,中国网民人数2.98亿人世界第一。,图表1-3 部分国家的互联网普及率,图表1-4 2007-2008年网民年龄结构对比,IP地址是什么意思？,任何连上Internet的计算机都叫做主机，每台主机都被指定了一个唯一的主机地址，就像每部电话都有一个电话号码一样，这便是IP地址。 (1).IP地址的表示形式 IP地址由四个数字，中间用一个点隔开，四个数字在0255之间。 例如：128.10.0.1

4、(2).IP地址的组成 IP地址=网络地址+主机地址 例如:IP地址是128.10.0.1的主机，128.10是网络地址，0.1是主机地址,问题2,图表1-5 2001-2008年中国IPv4地址资源变化,由数字组成的IP地址，没有规律和不便记忆。为了解决问题，引入域名替代IP地址。 域名是由代表一定意义的英文单词的缩写构成，用英文字母来表示IP地址，这样，人们就可以轻松地记住Internet上的各台主机地址了，这就是域名（Domain Name，简称DN)。 域名是Internet中计算机（主机）的名称，它包含有名称、类型、地域等信息。,什么是域名？,问题3,从技术上讲：域名只是一个Inte

5、rnet中用于解决地址对应问题的一种方法。可以说只是一个技术名词。但是，由于Internet已经成为了全世界人的Internet，域名也自然地成为了一个社会科学名词。从社会科学的角度看：域名已成为了Internet文化的组成部分。,从商界看：域名已被誉为企业的“网上商标”。没有一家企业不重视自己产品的标识-商标，而域名的重要性和其价值，也已经被全世界的企业所认识。中国国内域名注册的数量，从1996年底之前累计的300多个，至2008年12月增到1683万个。,域名的格式？,域名的一般格式为： 主机名.机构名.类别名.地区名 举例:,问题4,武汉职业技术学院 域名: IP地址：61.183.20

6、7.201,Internet中联网的计算机通常使用域名而不使用IP地址。,图表1-6 以机构分类的最高域名,图表1-7以国家或地区分类的域名代码,中央电视台 中国茅台酒厂 http:/www.china- 中国教育和科研计算机网 中国国务院 武汉市人民政府 中国红十字基金会 中国驻加拿大使馆 http:/www.chinaembassycanada.org/chn 美国国务院 http:/www.state.gov 美国国防部网站http:/www.defenselink.mil 海尔集团 澳门互联网资讯中心 .mo,图表1-8 2004-2008年中国域名规模的变化,图表1-9 中国按类别划

7、分的域名总数对比,WWW是什么意思？,WWW(World Wide Web)即环球信息网，也可以称为 Web，中文名字为“万维网”。WWW中的信息资源主要由大量的Web文档组成。这些Web页采用超级文本（Hyper Text），组成Internet上最庞大的服务类型。WWW 是Internet上发展最快和目前使用最广泛的一种服务。 WWW采用客户/服务器结构，其作用是响应客户端的请求，把客户端所需的资源传送给该客户。,问题5,HTTP是什么意思？,HTTP(HyperText Transfer Protocol)即超文本传输协议，它是WWW服务器上使用的最主要协议。通过这一跨平台的通信协议，在

8、WWW任何平台上的电脑都可以阅读远方服务器(Server)上的同一文件。HTTP协议经常用来在网络上传送Web页。当用户以http:/开始一个超链接的名字时，就是告诉浏览器去访问使用HTTP协议的Web页。,问题6,URL是什么意思？,URL(Uniform Resource Locator)即统一资源定位器，是Internet上信息资源的定位方法。它使用数字和字母来代表网页文件在网上的地址。也就是日常生活中所说的网址。URL好比Internet的门牌号码，它可以帮助用户在Internet的信息海洋中查找到所需要的资料。Web上所能访问的资源都有惟一的URL。,问题7,一个完整的URL地址由通

9、信协议名、服务器地址、文件在服务器中的路径和文件名四部分组成。例如： 服务器地址 路径 文件名,图表1-10 URL中常见的协议类型,浏览器能做什么？,常用的浏览器有： Internet Explorer(IE)、腾讯TT、Netscape等。 浏览器是一种软件，通过它可以方便地看到Internet上提供的Telnet、电子邮件、FTP、网络新闻组、电子公告栏等服务资源。 通过浏览器检索，无论用户所需的信息在什么地方，只要浏览器为用户检索到之后，就可以将这些信息(文字、图片、动画、声音等)“提取”到用户的计算机屏幕上。,问题8,问题9,什么是超链接？,超链接是WWW上的一种链接技巧，通过单击某

10、个图片或某段文字，就可以自动链接到相对应的其他文件，实现从一个网页链接到另一个网页。 超链接不仅可以链接图片、程序，甚至还可以链接音乐、影像等非页面的元素。,问题10,什么是网页？,网页是一个纯文本文件，其扩展名为.htm或.html等，网页文件中包含的内容可以是文字、图像、超链接、视频、声音等。网页是WWW系统中信息的基本单位。,前五名网页总数和平均数,截至2006年12月中国网站总数为843,000个, 网页数为44.7亿个 。,图表1-11 2002-2008年中国网页规模变化,图表1-12 中国网页数,截止：2008.12.31,问题11,什么是主页？,输入一个地址后在浏览器中出现的第

11、一页，就是主页，也称首页。通过主页，用户可以在短时间内了解网站所提供的信息和服务项目。 主页默认文件名index.htm,中国互联网管理中心主页,武汉职业技术学院主页,网站也称站点就是由一个个网页构成的。 网站的概念是相对的，大可以到“新浪网”这样的门户网站，页面多得无法计数，而且位于多台服务器上，小可以到一些个人网站，可能只有零星几个页面，仅在某台服务器上占据很小的空间。,问题12,什么是网站？,图表1-13 2000-2008年中国网站规模变化,图表1-14 前十名省市网站数,截止：2008.12.31,图表1-1 5 中国各类域名下网站数,截止：2008.12.31,1.2 HTML文档

12、的基本结构,什么是HTML语言？,HTML语言是英文“Hyper text Markup Language”的缩写，即超文本标记语言的简称。是WWW上通用的描述语言，是设计网页的基础语言。 超(Hyper)是相对于线性（linear）来说的。在很久以前，那时计算机程序还是线形运行的。当计算机程序执行完一个动作以后，转向下一行，这行结束后，继续下移，依次类推。但HTML则不同，可以在任何时候跳转到任何地方。,问题1,文本(Text)意味着它是自解释的（self-explanatory）。 标记(Markup)指的是你怎么处理文本。对文本作标记的方式，跟你在文本编辑程序里将文本加粗、或者将一行话设

13、为标题或列表项目类似。 语言(Language)是指HTML是一种语言，它使用了许多英文单词。,Hyper 超,Text 文本,Markup 标记,Language 语言,元素,首标记,尾标记,属性,内容,HTML元素、标记、属性及内容之间的关系是什么？,问题2,一个元素包括一个首标记(start tag)、零或多个属性(attribute)、内容和一个尾标记(end tag）。,HTML文件的基本结构是怎样？,问题3,HTML文件如何编辑、运行？,依次选择“开始菜单”“所有程序”“附件”“记事本”即可启动记事本程序。,问题4,制作一个网页，标题显示“第一个网页”，页面显示“哇！这是我设计的第

14、一个网页。”,案例1-1,程序:, 第一个网页 哇！这是我设计的第一个网页。 ,1.将上面的代码输入到记事本内，就完成了第一个网页的制作。 2.在记事本的“文件”菜单下选择“另存为”。 这时会弹出一个对话框。 3. 将HTML文档保存在D盘上的asp文件夹下，文件名为“1-1.htm”，选保存。 4.双击文件名运行网页，从显示的结果可以看到，网页标题“我的第一个网页”显示在浏览器窗口顶部标题栏上，网页页面上显示“哇！这是我设计的第一个网页。”这行文字。,如何设置标记的属性？,(2).也可用十六进制代码由“#”打头，后面跟6位数字或字母表示。6个十六进制数表示的RRGGBB(即红、绿、蓝3色的组

15、合)颜色，如:,问题5,Blue,green,Red,#0000ff,#00ff00,#ff0000,1.颜色在HTML文件中是如何表示的？ (1).可以使用HTML语言所给定的常量名来表示颜色， 如：,216个网页颜色表,2.使用格式 3.使用说明 bgcolor=red设置背景为红色； text=#0000ff设置文本颜色为蓝色。,HTML中的注释如何设置？,为了在以后读代码的时候，给用户提供必要的帮助和提示，可在编写代码的时候加上注释。 注释标记用来在HTML源文件中插入注释，注释会被浏览器忽略不显示。 1.使用格式 2.使用说明 在注释标记中，左括号“”后面需要添加一个“！”，而右括号

16、则无须添加。,问题6,利用基本标记，创建如下图所示的网页。,案例1-2, 显示在浏览器最上边蓝色条中的文本 深青色背景、红色文本 ,（三）、课堂练习,1.有一IP地址61.183.207.201,请问网络地址是_,主机地址是_。 2.请问网址是_机构的网址。 3.DN中文意思是_。 4.URL中文意思是_，一个完整的URL地址由_、_、_和_四部分组成。 5.什么是HTML语言？,（四）、课堂总结,这节课我们学习了Internet基础知识，掌握了一些与网页设计相关的名词和概念。通过5个案例，重点介绍了HTML语言的基本结构以及基本用法。,（五）、布置作业,习题一 P9 1.1、1.2、1.3、1.4、1.5,再见！,