山东专升本盘算机文明基础第七版PPT课件_石油大学出版社第9章[整理版].ppt

第 九 章 网 页 制 作 ;第九章 网页制作;9.1 HTML简介;9.1 HTML简介;9.1.1 HTML语言概述 ;1. HTML文件的基本构成 Internet中的每一个HTML文件都包括文本内容和HTML标记两部分。其中，HTML标记负责控制文本显示的外观和版式，并为浏览器指定各种链接的图像、声音和其他对象的位置。多数HTML标记的书写格式如下： 标记名文本内容/标记名 标记名写在“ ”内。多数HTML标记同时具有起始和结束标记，并且成对出现，但也有些HTML标记没有结束标记。另外，HTML标记不区分大小写。; 某些HTML标记还具有一些属性，这些属性指定对象的特性，如背景颜色、文本字体及大小、对齐方式等。属性一般放在“起始标记”中，格式如下： 标记名 属性1=值1 属性2=值2 … 文本内容 /标记名 其中标记名和属性之间用空格分隔。如果标记有多种属性，属性之间也要用空格分隔。 ;2. HTML网页的结构 现在我们先看一个简单的HTML文件，从中体会用HTML语言编写网页时的层次结构。 【例9-1】用HTML语言编写一个简单的网页。 html head title我的第一个Web页/title /head body h1欢迎进入HTML世界！/h1 p这里我们首先介绍HTML语言的基本知识和语法。然后，讲授如何使用HTML语言编写您的Web页面。/p /body /html;HTML语言概述; 从上例可以看出，一般HTML文件都是以html开头，以/html结束。其文件结构由以下两部分组成： 1）头部（Head） HTML文件的头部由head和/head标记定义。通常情况下，文件的标题、语言字符集信息等都放在头部信息中。最常用到的标记是title…/title，它用于定义网页文件的标题，当该网页文件被打开后，网页文件的标题将出现在浏览器的标题栏中。;文件结构;9.1.2 HTML语言的基本语法;2. 文字格式 HTML语言中用于文字格式化的标记有： 1）标题标记hn 格式为：hn 属性=属性值 标题文字内容 /hn 其中n说明大小级别，取值范围为1到6的数字。把标题分为 6级，即h1~h6，其中h1文字最大，h6文字最小。;2）字体标记font 字体标记用来对文字格式进行设置，主要具有以下属性： （1）size属性：用来控制文字的大小，格式如下： font size=n…/font 其中n的取值范围为1～7的数字，默认值为3。 font标记和hn标记都可以控制文字的大小。一般情况下，文章的标题最好由hn标记控制，而其余的文字由font标记控制。相比较而言，font对字体的控制更加灵活。 （2）color属性：用来控制文字的颜色，格式如下： font color=#n或英文表示的颜色…/font 其中n是一个十六进制的六位数。 （3）face属性：用来指明文字使用的字体，格式如下： font face=字体名…/font其中字体名的选择由Windows操作系统安装的字体决定。如：宋体、楷体_GB2312、Times New Roman、Arial等。;3）字形标记 字形标记用于设置文字的粗体、斜体、下划线、上标、下标等。 ;3. 插入图片 img标记将图片插入网页中，用于设置图片的大小以及相邻文字的排列方式。该标记具有以下属性： （1）src属性：指明图片文件所在的位置。格式如下： img src =URL 其中URL指图片文件存放的位置。 （2）alt属性：图片的文字说明，当鼠标指针指向图片时，该图片的说明性文字弹出。格式如下： img src =URL alt =说明文字 （3）width和height属性：设置图片显示区域的宽度和高度。格式如下： img src =URL width =n1 height =n2 其中width和height属性的取值n1和n2，可以是像素数或百分比。;（4）border属性：设置图片文件的边框。格式如下： img src =URL border =n 其中n为像素数。 （5）align属性：设置图片相对于文本的位置关系。格式为：img src =URL align =对齐方式 对齐方式可以是：top（顶端对齐）、middle（相对垂直居中）、bottom（相对底边对齐）、left（左对齐）、right（右对齐）、texttop（文本上方）等。;4. 插入超链接 在HTML语言中，a和/a标记用于设置网页中的超链接，href属性