计算机络 网页制作语言 西安电子科技大学 刘怀亮
计算机网络 ——网页制作语言 西安电子科技大学 刘怀亮
页建立与维护 一、网页的制作语言HTML 二、网页脚本语言— JavaScript 退出
网页建立与维护 一、 网页的制作语言HTML 二、 网页脚本语言——JavaScript 退出
1 HTML语言的结构 2构成网页的基本元素 网页的制作语 13超文本链接指针 14在HTML文件中使用图像 15框架结构的使用 16表单的应用 17HTML中的表格 返
1.1 HTML 语言的结构 1.3 超文本链接指针 1.2 构成网页的基本元素 1.4在HTML文件中使用图像 1.6 表单的应用 1.5 框架结构的使用 1.7 HTML中的表格 1 网 页 的 制 作 语 言 返 回
1.1HTML语言的结构 HML(超文本标记语言)是一种描述文档结构的标注语言, 它使用一些约定的标记对WWW上的各种信息进行标注。当用户浏览 Www上的信息时,浏览器会自动解释这些标记的含义,并按照一定的 格式在屏幕上显示这些被标记的文件。M的优点是其跨平台性。 即任何可以运行浏览器的计算机都能阅读并显示HM文件,不管其 操作系统是什么,并且显示结果相同 HML文件是标准的ASCI文件,且其后缀名为htm或htm1的 文件。HTM文件看起来象是加入了许多被称为链接莶(tag)的特殊 字符串的普通文本文件。从结构上讲,HM文件由元素( element) 组成,组成HTM文件的元素有许多种,用于组织文件的内容和指导 文件的输出格式。绝大多数元素是“容器”,即它有起始标记和结 尾标记。元素的起始标记叫做起始链接签( start tag),元素结朿 标记叫做结尾链接签( end tag),在起始链接莶和结尾链接签中间 的部分是元素体。每一个元素都有名称和可选择的属性,元素的名 称和属性都在起始链接签內标明
HTML（超文本标记语言）是一种描述文档结构的标注语言， 它使用一些约定的标记对WWW上的各种信息进行标注。当用户浏览 WWW上的信息时，浏览器会自动解释这些标记的含义，并按照一定的 格式在屏幕上显示这些被标记的文件。HTML的优点是其跨平台性。 即任何可以运行浏览器的计算机都能阅读并显示HTML文件，不管其 操作系统是什么，并且显示结果相同。 HTML文件是标准的ASCII文件，且其后缀名为htm或html的 文件。HTML文件看起来象是加入了许多被称为链接签（tag）的特殊 字符串的普通文本文件。从结构上讲，HTML文件由元素（element） 组成，组成HTML文件的元素有许多种，用于组织文件的内容和指导 文件的输出格式。绝大多数元素是“容器” ， 即它有起始标记和结 尾标记。元素的起始标记叫做起始链接签（start tag），元素结束 标记叫做结尾链接签（end tag），在起始链接签和结尾链接签中间 的部分是元素体。 每一个元素都有名称和可选择的属性，元素的名 称和属性都在起始链接签内标明。 1.1 HTML 语言的结构
下面来看一个HML文件: KHTML> 西安电子科技大学经管院 K/HEAD> ABodY bgcolor= yellow> 这是第一个HTM的测试文件 K/BODY> 西安电子科技大学经管院- Tencent Traveler K/HTML> 文件()编辑(E)查看()收藏A)工具(D在线服务(Q)帮助(H 地址fi1e://C:/001.htm 转到搜索 Q索 西安电子科技大学经管院 8回回 这是第一个HM的测试文件 比 蔽:0④×0②巴我的电脑
下面来看一个HTML文件: 西安电子科技大学经管院 这是第一个HTML的测试文件
1.2构成网页的基本元素 1.标记 标记用来给网页命名,网页的名称写在与 标记之间,显示在浏览器的标题栏中。例如,在上图中所 示的浏览器页面中,其标题栏所显示的“西电经管院”是在HTML文 件中的由西电经管院所定义的。 2.标记 文件)编辑￠)查看收藏④)工具〔)帮助0p h . 到 地址@)同Rtp/ubn/Pt3mxe!tm →转到 4H6°5H6标题元素有6标题测试 种,用于表示文章中的各 种题目。字体大小顺序减小。下面这个|标题测试 例子中分别使用了到 标题测试 的标题。其HML文|跳 件如下所示,在浏览器中 标原洲战 的显示效果如右图所示 完成 本地 Intranet 源文件
标记用来给网页命名，网页的名称写在与 标记之间，显示在浏览器的标题栏中。例如，在上图中所 示的浏览器页面中，其标题栏所显示的“西电经管院”是在HTML文 件中的由西电经管院所定义的。 1.2 构成网页的基本元素 1．标记 … 到 …标题元素有6 种，用于表示文章中的各 种题目。字体大小到 顺序减小。下面这个 例子中分别使用了到 的标题。其HTML文 件如下所示，在浏览器中 的显示效果如右图所示。 2．标记 源文件
3.预格式化文本标记.通知 浏览器。在左图和右图中显示了有无预格式化文本标记pe>的对比 这是一个谢试网回区这是个训试网员线1址,口区 文件)编辑)查看” 文件￠)编辑c)查看Q)收藏④) 停止刷新 上 地址@同H∥c转到「地0图m3到 HTM是一种描述文档结构的标注语 H狙L是一种描述文档结构的标注语 言,它使用一些约定的标记对各种信息 言,它使用一些约定的标记对各种信 进行标注。 息进行标注。 完成 思本地 Intranet 包完成 本地 Intranet∥ 源文件
3．预格式化文本标记 源文件 HTML的输出是基于窗口的，因而HTML文件在输出时都是要重 新排版的，即把文本上任何额外的的字符（如空格、制表符和回车符） 都忽略，若确实不需要重新排版的内容，可以用…通知 浏览器。在左图和右图中显示了有无预格式化文本标记的对比
4.和标记 用于强制换行。表示一个段落的开始。一般可 不用。 5.标记 这几个标记都是用来修饰所包含文档的。标记使文本加粗; 标记使文本倾斜;标记给文本加下划线;标记给文本加 删除线;标记使文本字体加重。下面给出一个HTM源 文件,其显示结果如下图所示。 这是一个测试网页- Microsoft Internet Explorer 文件)编辑C)查看)收藏)工具①)帮助Q 源文件 地址@Mtp/litn/re3alh →转到 HTL是一种撈述文档结鸬的标注语言,它使用一些约定的标记 对各种信息进行标注。 本地 Intranet
4．和标记 源文件 用于强制换行。 表示一个段落的开始。一般可 不用。 5． 标记 这几个标记都是用来修饰所包含文档的。标记使文本加粗； 标记使文本倾斜；标记给文本加下划线；标记给文本加 删除线；标记使文本字体加重。下面给出一个HTML源 文件，其显示结果如下图所示
6.标记 …FONT用来标记说明 修改字体和颜色。其中 COLOR属性指定文字颜色 颜色的表示可以用6位十六进 Bgcolor设置网页背景颜色 制代码,如标记扩充为: 色 Backgrou设置网页背景图案 <BOdY bgcolor=# text=# nd linke alink# vlink# mageR设置网页背景图案的URL地址 background= imageURL 其中各个元素的说明如表8-1 代表颜色RGB值(格式为rgbb)。 所示,表8-2列出了一些常用 它是用16进制的红绿-蓝(red 颜色的RGB值。 green-bue,RGB)值来表示。各种 常见的颜色的RGB值如表9-2所示
6．标记 …用来 修改字体和颜色。其中 COLOR属性指定文字颜色， 颜色的表示可以用6位十六进 制代码，如；SIZE属性指定相 对尺寸。 另外， 如果用户想要设置网 页的背景色和文字颜色，可以 将标记扩充为： 其中各个元素的说明如表8-1 所示，表8-2列出了一些常用 颜色的RGB值。 标记 说明 Bgcolor 设置网页背景颜色 Text 设置网页非可链接文字的颜色 Link 设置网页可链接文字的颜色 Alink 设置网页正被点击的可链接文字的颜 色 Vlink 设置网页已经点击的可链接文字的颜 色 Backgrou nd 设置网页背景图案 ImageUR L 设置网页背景图案的URL地址 # 代表颜色RGB值（格式为rrggbb）。 它是用16进制的红-绿-蓝（redgreen-blue，RGB）值来表示。各种 常见的颜色的RGB值如表9-2所示
颜色 RGB颜色 RGB 黑色(Back) 00000榄色(Oive)808000 红色(Red) FF0000深表色(Tea)008080 绿色( Green) 008000恢灰色(Gray)808080 蓝色(B|ue) 000F深蓝色(Nawy)0080 白色(Whte) FFFFFF浅绿色(Lime)00FF00 黄色(Ye|low) FFF00紫红色( Fuchsia FFOC0FF 银色( Silver) OCOC0紫色( Purple)8000 浅色(Aqua) oFFF茶色 Maroon)8000
颜色 RGB 颜色 RGB 黑色（Black） 000000 橄榄色（Olive） 808000 红色（Red） FF0000 深表色（Teal） 008080 绿色（Green） 008000 灰色（Gray） 808080 蓝色（Blue） 0000FF 深蓝色（Navy） 000080 白色（White） FFFFFF 浅绿色（Lime） 00FF00 黄色（Yellow） FFFF00 紫红色（Fuchsia ） FF00FF 银色（Silver） C0C0C0 紫色（Purple） 800080 浅色（Aqua） 00FFFF 茶色（Maroon） 800000