网页制作简明教程

网页制作简明教程第1章HTML基础--------------------------------------------------------------------------------1.1什么是HTML1.1.1Web页的基本概念1.1.1.1Internet与通俗地讲，Internet就是许多不同功能的计算机通过网络设备连接起来组成一个覆盖全球的网络。从信息资源的角度看，Internet是一个集各个部门、各个领域的各种信息资源为一体，供网上用户共享信息资源网。Internet能提供的服务包括：服务、E-mail服务、FTP服务、TELNET服务、网上传呼（ICQ;OICQ）、电子商务、网络炒股、在线聊天、联网游戏等。由此可见，(WorldWideWeb，译为“万维网”)并不就是Internet，它只是Internet提供的服务之一，不过它是Internet上发展最为蓬勃的部分，相当多的其他Internet服务是基于服务的。1.1.1.2与浏览器从技术的角度讲，服务器的计算机组成，它将不同的信息资源有机地组织在一起，能过一种叫浏览器的软件进行浏览。浏览器是获取服务的基础，它的基本功能就是对网页进行显示。1.1.1.3网站与主页服务器构成的，通过浏览器访问这些服务器上的网页，不同的网页通过超链接联系在一起，构成了的纵横交织结构。通常我们把一系列逻辑上可以视为一个整体的页面叫做网站，或者说，网站就是一个有共同主题的页面的集合。主页是网站中一个特殊页面，它是网站的入口页面，其中包含指向其他页面的超链接。通常主页的名称是固定的，例如：index.html（.html或.htm后缀表示HTML文档）1.1.2HTML的工作原理HTML（HyperTextMarkupLanguage，超文本标记语言）是表示网页的一种规范（或者说是一种标准），它通过标记符定义了网页内容如何显示。网页是用HTML语言写成的文本文件，但它与文本文件不同的是，网页中包含有指向其它位置的链接，通过这些链接使网页组织成了网状结构。在HTML文档中，通过使用标记符可以告诉浏览器如何显示见网页，即确定网页内容的显示格式。所以HTML文档就是网页文件，有时也称为Web页。1.2创建Web页1.2.1标记符基础HTML语言是影响网页内容显示格式的标记符集合，浏览器根据标记符决定网页的实际显示效果。1.2.1.1基本的HTML语法在HTML中所有的标记都用尖括号括起来。绝大多数的标记符是成对出现的，即有开始标记符与结束标记符，开始标记符和相应的结束标记符定义了标记所影响的范围。结束标记符与开始标记符的区别是多一个斜线。例如：h1让我们一起来学习HTML!!/h1但是，也有少数标记符是单一的不成对的，例如：br、hr等。HTML标记符是不区分大小写的。1.2.1.2标记符的属性属性是用来描述对象特征的特性。许多标记符还包含一些属性，以便对标记符作用的内容进行更详细的控制。在HTML中，所有的属性都放置在开始标记符的尖括号里，属性与标记符之间用空格分隔；属性的值放在相应的属性名之后，用等号分隔；而不同的属性之间用空格分隔。例如：fontsize=7color=red大家好/font1.2.2Web页的基本结构HTML文档中通常都包括以下基本标记符：html和/html、head和/head、body和/body。1.2.2.1HTML标记html是Web页的第一个标记符，/html是最后一个标记符。Web页的其它所有内容都必须位于这两个标记符之间。1.2.2.2首部标记head和/head位于Web页的开头，其中不包括Web页的任何实际内容，而是提供一些与Web页有关的特定信息。首标记的内容也用特定的标记括起来。(1)TITLE标记符在首标记符中，最基本、最常用的是标题标记符title/title，用于定义网页的标题，网页标题可被浏览器用书签和收藏清单。(2)META标记符它用于说明Web页有关的信息。在META标记符中常用的属性有：name、http-quiv以及content。name是给出关于网页某一属性的名称，而content是给出属性的值，http-equiv指定HTTP响应名称，通常用于替换name属性。META标记符的一个常用功能是设置自动页面跳转。即使浏览器自动从一个页面跳马转到另一个页面。语法格式如下：METAhttp-equiv=Refreshcontent=5;url=URL(3)BGSOUND标记符它用于指定网页的背景音乐。语法格式如下：BGSOUNDsrc=音乐文件loop=播放次数音乐文件的格式一般为.wav、.mid或.mp3。1.2.2.3正文标记符正文标记符BODY和/BODY包含Web页的内容。文字、图形、链接以及其他HTML元素都位于该标记符内。注意：空格、回车这些格式控制在显示时都不起作用，如要使它们起作用，应使用预格式化元素PRE和/PRE。1.2.3设置页面属性正文标记符包括一些常用属性，用于设置网页背景颜色和图案，以及设置文档和超链接的颜色。(1)颜色的表示在HTML中可以用两种方式来表示颜色：通过颜色名表示颜色通过设置RGB（RedGreenBlue）值来表示颜色通过颜色名表示颜色，直接给出要显示颜色的英文名称即可。但是，在HTML中只保留了16个颜色名，所以用颜色名所能表示的颜色很有限。通过RGB值表示颜色，是利用三色光的相互混合调制出成千上万种颜色。RGB表示法的标准格式是：以“#”开头，后面紧跟着6位16进制数，每2位为一组，代表一种颜色成分，按“#RRGGBB”方式排列。#000000#008000#C0C0C0#00FF00#808080#808000#FFFFFF#FFFF00#800000#000080#FF0000#0000FF#800080#008080#FF00FF#00FFFF1.2.3.2设置页面背景图像设置页面背景图像是通过设置BODY标记符中的background属性实现的，其语法格式如下：bodybackground=图像文件的URL1.2.3.3设置背景图像水印效果InternetExplorer还支持BODY标记符的另一个属性—bgproperties，该属性可以设置背景图案的水印效果。语法格式如下：bodybackground=图像文件URLbgproperties=效果1.2.3.4设置文字和超链接的颜色设置正文和超链接的颜色，可以使用BODY标记符的text、link、vlink和alink属性。常用的语法格式如下：bodytext=#RRGGBBlink=#RRGGBBvlink=#RRGGBBalink=#RRGGBB其中：text用于设置正文颜色link用于设置未被访问的超链接的颜色vlink用于设置已被访问的超链接的颜色alink用于设置激活超链接的颜色1.2.4添加注释不论是编写程序还是制作网页，为所做的工作添加注释都是一种良好的工作习惯。HTML的注释由开始标记符!--和结束标记符--构成。注释内容都将被浏览器解释为注释，而不在浏览器中显示。1.2.5显示特殊字符如果需要在网页中显示某些特殊字符，例如:（小于号）、（大于号）、”（引号）等，则需使用参考字符来表示，而不能直接输入。参考字符以“&”号开始，以“；”结束，既可以使用数字代码，也可以使用代码名称。最常见的特殊字符如下表所示（完整的编码请参见附录2）特殊字符数字代码代码名称+"&&&<<>>1.3发布Web页1.3.1创建本地站点1.3.2申请网页空间1.3.3用FTP上传网页--------------------------------------------------------------------------------第2章文本格式--------------------------------------------------------------------------------2.1文本分段在HTML文档中对段落的控制包括：段落标记符P、换行标记符BR、水平线标记符HR、标题标记符Hn、用于设置段落对齐的align属性、DIV标记符以及CENTER标记符。2.1.1段落标记符P和换行标记符BR分段标记符分段标记符用于将文档划分为段落，标记为P/P，其中结束标记符通常可省略。换行标记符换行标记符用于在文档中强制断行，标记为一个单独的BR。2.1.2水平线标记符HR在HTML中除了可以用P标记划分落，还可以用添加水平线的方法分隔文档的不同部分。水平线的标记符为HR，它包括以下属性：SIZE属性用来改变水平线的粗细程度WIDTH属性用来更改水平线的长度NOSHADE属性用来使水平线以实线显示COLOR属性用来设置水平线的颜色ALIGN属性用来设置水平线的对齐方式其中：COLOR属性在MicrosoftInternetExplorer3及更高版本中，通过在HR中设置COLOR属性可以控制水平线的颜色。2.1.3标题标记符Hn在HTML中，用户可以通过Hn标记符来标识文档中的标题和副标题，其中：n是1-6的数字；H1表示最大的标题，H6表示最小的标题。使用标题样式时，必须使用结束标记符。2.1.4段落对齐在HTML中，一般使用标记符的align属性来设置段落的对齐方式。2.1.4.1align属性ALIGN属性用于设置段落的对齐格式，其值包括：RIGHT（右对齐）LEFT（左对齐）CENTER（居中对齐）JUSTIFY（两端对齐）ALIGN属性可应用于多种标记符，最典型的是应用于DIV、P、Hn（标题标记符）、HR等标记符。2.1.4.2DIV标记符CENTER标记符DIV标记符DIV标记符用于为文档分节，以便为文档的不同部分应用不同的段落格式，其标记为DIV/DIV。位于DIV标记符中的多段文本将被认为是一个节，可为它们设置一致的对齐格式。SPAN标记符SPAN标记符的功能及用法与DIV相似，但通常用于标记一行内的某些字符。CENTER标记符如果要将文档内容居中，还可使用CENTER标记符，方法为：将需居中的内容置于CENTER和/CENTER之间。2.2控制文本的显示效果2.2.1字体控制标记符FONTFONT标记符用于控制字符的样式，包括开始标记符FONT和结束标记符/FONT，FONT标记符具有3个常用的属性：size属性字号属性的值可以从1到7，3是默认值，字号越大显示的字符就越大。该属性值也可以用+n或-n来作为相对值指定。color属性字体标记符的COLOR属性可用来控制文字的颜色，使用方法与正文标记符BODY中使用的BGCOLOR属性相同。但要注意一般不能将color的属性值与bgcolor的属性值设置为相同。face属性FACE属性用来指定字体样式。在这个属性中用户可以指定一个或几个字体名称（用逗号隔开）。2.2.2用物理字符样式所谓物理字符样式，是指标记符本身就说明了所修饰文字的效果的标记符。常用的物理标记符有：标记符功能标记符功能B/B粗体STRIKE/STRIKE删除线BIG/BIG大字体SUB/SUB上标I/I斜体SUP/SUP下标S/S删除线TT/TT等宽SMALL/SMALL小字体U/U下划线2.2.3逻辑字符样式所谓逻辑字符样式是指标记符本身从某种程度上反映了被修饰对象所表示的含义。例如：ADDRESS标记符用以修饰某个地址。常用逻辑字符样式如下表:标记功能ADDRESS/ADDRESS用于修饰地址CI