HTML语言基础课件_第1页
HTML语言基础课件_第2页
HTML语言基础课件_第3页
HTML语言基础课件_第4页
HTML语言基础课件_第5页
已阅读5页，还剩72页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

HTML语言基础

HTML（HyperTextMarkupLanguage，即超文本标记语言）是一种用来制作超文本文档的简单标记语言。用HTML编写的超文本文档称为HTML文档，它能独立于各种操作系统平台（如UNIX，WINDOWS等）。自1990年以来HTML就一直被用作WWW上的信息表述语言，用于描述网页的格式设计和它与WWW上其它网页的链接信息。

HTML文档（即网页的源文件）是一个放置了标记的ASCII文本文件，通常它带有.html或.htm的文件扩展名。生成一个HTML文档主要有以下三种途径：

（1）手工直接编写（例如用你所喜爱的ASCII文本编辑器或其它HTML的编辑工具）。（2）通过某些格式转换工具将现有的其它格式文档（如WORD文档）转换成HTML文档。（3）借助专用制作工具软件，如Frontpage、Dreamweaver等进行设计与制作。

HTML语言是通过利用各种标记（tags）来标识文档的结构以及标识超链接（Hyperlink）信息的。虽然HTML语言描述了文档的结构格式，但并不能精确地定义文档信息必须如何显示和排列，而只是建议Web浏览器（如Mosiac，Netscape等）应该如何显示和排列这些信息，最终在用户面前的显示结果取决于Web浏览器本身的显示风格及其对标记的解释能力。这就是为什么同一文档在不同的浏览器中展示的效果会不一样的原因。3.1网页设计基本原则

设计网页如同编写其它计算机程序一样,需要一定的专业知识和基本技能，而且必须对设计环境有个明确的了解。在设计网页的过程中，要清楚地了解网页的阅读对象，要对整个网络文档有统一的规划。总体说来，要了解以下基本设计原则：

（1）正确分析网页用户的需要。（2）网页下载时间不宜过长。注意网页文件的大小，在50KB以内为宜。（3）网页的设计要做到在不同的环境下都能浏览。（4）注意网页中的图形设计。首先，图形的文件大小要尽可能小，尽量使用GIF文件和JPG文件，不使用BMP文件。其次，每个图形都要有相应的替代文字，这使得用户在关闭图形显示功能时能够看到替代文字。（5）定期更新网页内容。每隔一定时间就对网页内容和版面设计进行较大幅度的更新，从而吸引访问者的注意力。这不失为增加来访次数的好方法。（6）注意网站内容的搭配。在首页中尽量使之美观大方，直观又丰富。其它网页要与首页有很好的搭配效果。（7）考虑不支持某些功能的浏览器。随着网页设计技术的不断进步，在网页中经常会使用一些特殊的技术，使得网页的功能更加丰富，看起来也更加美观。但是不可排除一些用户使用过时的浏览器浏览这些网页，这就需要为这些特殊的功能部分添加替代性文字，避免误将程序代码显示出来。（8）对多媒体文件实施有限的限制。尽管网络多媒体技术有了很大的发展，但由于网络速度的限制，就要求一个网页设计者在设计网页时要充分考虑到所添加多媒体部分的大小和必要性。3.2HTML语言的结构

从结构上讲，HTML文件由元素（element）组成。组成HTML文件的元素有许多，用于组织文件的内容和指导文件的输出格式。绝大多数元素是“容器”，即它有起始标记和结尾标记。元素的起始标记叫做起始标记(starttag)。元素结束标记叫做结尾标记(endtag)。在起始标记和结尾标记中间的部分是元素体。每一个元素都有名称和可选择的属性，元素的名称和属性都在起始标记内标明。比如体元素(body)：

<bodybackgroud＝"background.gif"><h2>示例</h2>这是一个示例<p></body>第一行是体元素的起始标记，它标明体元素从此开始。由于所有的标记都具有相同的结构，因此仔细分析这个标记的各个部分，就能对标记的写法有一个大概了解。<起始标记开始

body元素名称，由于元素和标记一一对应，所以元素名也叫标记名。注意：<和body之间不能有空格。元素名称不分大小写。

background属性名。一个元素可以有多个属性，属性及其属性值不分大小写。

background.gif属性值。表示用

background.gif文件来填充背景。属性名、=、属性值三者合起来构成一个完整的属性，一个元素可以有多个属性，各个属性用空格分开。

>起始链接链结束。第二行和第三行是body元素的元素体，最后一行是body元素的结尾标记。结尾标记用</开始，随后是元素名，然后是大于号>。

从上面的例子中可以看出，一个元素的元素体内可以有另外的元素。实际上，html文件仅由一个html元素组成，即文件以<html>开始，以</html>结尾，文件其它部分都是html的元素体。html元素的元素体由两大部分，即头元素<head>…</head>和体元<body>…</body>和一些注释组成。头元素和体元素的元素体又由其它的元素和文本及注释组成。也就是说，一个HTML文件应具有下面的结构：

<html>html文件开始<head> 文件头开始文件头</head> 文件头结束<body> 文件体开始文件体</body> 文件体结束</html> HTML文件结束需要说明的是，HTML是一门发展很快的语言，因而现在流行的浏览器为保持对早期HTML文件的兼容性,也支持不按上述结构编写HTML文件。还需要说明的是，各种浏览器对HTML元素及其属性的解释也不完全一样。一般来讲，HTML的元素有下列三种表示方法：<元素名>文件或超文本</元素名>。<元素名属性名=“属性值…”>文本或超文本<／元素名>。<元素名>

第三种写法仅用于一些特殊的元素，例如分段元素P，它仅仅通知WWW浏览器在此处分段，因而不需要界定作用范围，所以它没有结尾标记。HTML3.0标准中，也定义了</p>标记，它用于需要界定作用范围的段落，比如增加对齐方式属性的段落。在HTML文件中，有些元素只能出现在头元素中，绝大多数元素只能出现在体元素中。在头元素中的元素表示的是该HTML文件的一般信息，比如文件名称、是否可检索等等。这些元素书写的次序是无关紧要的，它只表明该HTML有没有该属性。与此相反，出现在体元素中的元素是次序敏感的，改变元素在HTML文件中的次序会改变该HTML文件的输出形式。3.3构成网页的基本元素3.3.1题目(title)title元素是文件头中唯一一个必须出现的元素，它也只能出现在文件头中。title元素的格式为：<title>题目</title>题目：标明该HTML文件的题目，是对文件内容的概括。文件的题目一般不会显示在文本窗口中，而以窗口的名称显示出来。除了标识窗口外，当将某一网页存入书签或文件时，题目还用作书签名或缺省的文件名。<html><title>一个简单的html文件</title>这是我的第一个html文件。</html>虽然题目的长度没有限制，但过长的题目会导致折行，一般情况下它的长度不应超过64个字符。由于题目的作用是标明文件内容，所以太短的题目也是不可取的。在头元素中还可以出现其它元素，如<isindex>，<meta>等等，这些元素都不是必须的，而且也不常用。具体用法及含义可以参考有关书籍。下面是一个最简单的HTML文件：3.3.2标题(hn)

标题标签用于显示HTML文件的各级标题，格式为:<Hn>标题内容</Hn>其中n为1-6之间的整数，其值越大，字越小．也就是说第一级标题(H1)字最大，第六级(H6)最小。标题内容用黑体字显示，各行之间自动插入空行。<H4>多用作文本正文；H6字体最小(几乎不用)。<H1>至<H3>比一般正文字体大，而<H5>至<H6>比一般正文字体小。由于标题标签具有段落属性，这就使得一个段落内不能使用两种标题标签。图3-1给出了由下面代码产生的屏幕效果。<html><head><title>标题示例</title></Head><body> <h1>一级标题是这样的</h1> <h2>二级标题是这样的</h2> <h3>三级标题是这样的</h3> <h4>四级标题是这样的</h4> <h5>五级标题是这样的</h5> <h6>六级标题是这样的</h6></body></html>图3-1hn的屏幕输出结果3.3.3分段<P>

HTML的浏览器是基于窗口的，用户可以随时改变显示区的大小，所以HTML将多个空格以及回车看成一个空格，这是和绝大多数字处理器不同的。HTML的分段依赖于分段元素<P>。<P>也有多种属性，比较常用的属性是：align＝##可以是left，center，right，其含义同上文。例如：<palign=center>段落居中</p>当HTML文件中有图形时，图形可能占据了窗口的一端，图形的周围可能有较大的空白区。这时，不带clear属性的<P>可能会使文章的内容显示在该空白区内。为确保下一段内容显示在图形的下方，可使用clear属性。clear属性的含义为：clear=left下一段显示在左边界处空白的区域。clear=right下一段显示在右边界处空白的区域。clear=all下一段的左右两边都不许有别的内容。3.3.4清单List清单用于列举事实。常用的清单有3种格式，即无序清单(unorderedList)，有序清单(orderedlist)和定义清单(definitionlist)。1．无序清单(ul)无序清单用(ul，此处的l不是数字1)开始，每一个清单条目用<li>引导，最后是</ul>。注意清单条目不需要结尾标记</li>。输出时每一清单条目缩进，并且以圈点标示。例如：<ul><li>今天<li>明天</ul>输出为：○今天○明天2．有序清单<ol>有序清单与无序清单相比，只是在输出时清单条目用数字标示，下面是一个例子及其输出。<ol><li>今天<li>明天</ol>输出为：1.今天2.明天

3．定义清单<dl>定义清单用于对清单条目进行简短说明的场合，用<dl>开始，清单条目用<dt>引导，它的说明用<dd>引导。<dl><dt>条目1<dd>条目1的定义<dt>条目2<dd>条目2的定义</dl>输出为：条目1条目1的定义条目2条目2的定义3.3.5居中很多元素都有对齐方式属性，如hn、p等。也可以直接用居中标记<center>…</center>：图3-2

对齐方式示例

<h3align=center>今天的</h3><center>天气真好！！！</center>输出结果如图3-2所示。3.4超文本链接指针超文本链接指针是html最吸引人的优点之一。使用超文本链接指针可以使顺序存放的文件具有一定程度上随机访问的能力，更加符合人的思维方式。组织得好的链接指针不仅能使读者跳过不感兴趣的章节，而且有助于更好地理解作者的意图。一个超文本链接指针由两部分组成：一部分是被指向的目标，它可以是同一文件的另一部分，也可以是世界另一端的一个文件，还可以是动画或音乐；另一部分是指向目标的链接指针。3.4.1统一资源定位器URL

统一资源定位器URL(UiformResourceLocator)是文件名的扩展。在单机系统中，定位一个文件需要路径和文件名，对于遍布全球的Internet网，显然还需要知道文件存放在哪个网络的哪台主机中才行。与单机系统不一样的是在单机系统中，所有的文件都由统一的操作系统管理，因而不必给出访问该文件的方法；而在Internet上，各个网络、各个主机的操作系统可能不一样，因此必须指定访问该文件的方法。一个URL包括了以上所有的信息。它的构成为：protocol://[:port]/directory/filename其中，protocol是访问该资源所采用的协议，即访问该资源的方法，它可以是：http：超文本传输协议，该资源是html文件。file：文件传输协议，用ftp访问该资源。ftp：文件传输协议，用ftp访问该资源。news：表明该资源是网络新闻组。：是存放该资源主机的IP地址，通常以字符形式出现，如mail.edu.cnport端口号：是服务器在该主机所使用的端口号。一般情况下端口号不需指定。只有当服务器所使用的端口号不是缺省的端口号时才指定，例如WWW服务默认情况下采用的端口号为80，如果设置了其它的端口号，访问时必须加上端口号。directory和filename：该资源的路径和文件名.一个典型的URL为：http://www.edu.cn它表示中国教育和科研计算机网WWW服务器上的起始html文件。（文件具体存放的路径及文件名取决于该WWW服务器的配置情况）。与单机系统绝对路径、相对路径的概念类似，统一资源定位器也有绝对URL和相对URL之分。前面所述的是绝对URL。相对URL是相对于最近访问的URL。比如你正在浏览一个URL为http://www.edu.cn/index.html的文件，如果想看同一个目录下的另一个文件如http://www.edu.cn/news.html，就可以直接使用news.html，这时news.html就是一个相对URL，它的绝对URL为http://www.edu.cn/news.html

3.4.2指向一个目标<a>

在html文件中可用链接指针指向一个目标。其基本格式为：<ahref="url">字符串</a>href属性中的url是被指向的目标，随后的“字符串”在html文件中充当指针的角色，它一般显示为蓝色，也可以定义成其它颜色。当用户用鼠标点击这个字符串时，浏览器就会将url处的资源显示在屏幕上。

在编写html文件时，需要知道目标的url。如何才能得到目标的url呢？对于自己主机内的文件，它的url可以根据该文件的实际情况决定。对于Internet上的资源，在用浏览器观看时，它的url会在浏览器的“地址栏”中显示出来，把它抄下来写到html文件中即可。此外，编写html文件时，对有可能确定关系的一组资源（比如在同一个目录中）应采用相对url，

这不仅可以简化html文件，而且便于维护。比如当需要将某个目录整个搬到另外一个地方或把某一主机的资源移到另一台主机时，用相对url写的html文件不用更新其中的url。但如果用绝对url编写html文件，那么就逐个修改每个链接指针中的url。

若各个资源之间没有固定的关系，这时就只能用绝对url了。3.4.3标记一个目标上面提到的链接指针可以使读者在整个Internet网上方便地链接。但如果编写了一个很长的html文件，怎么能在同一文件的不同部分之间也建立起链接，使用户方便地在上下方之间跳转呢？前面提到一个超文本链接指针包括两个部分：一是指向目标的链接指针，二是被指向的目标。对于一个完整的文件，可以用它的url来唯一地标识它，但对于同一文件的不同部分，怎样来标识呢？下面的内容将介绍链接指针元素的另外的一个用途：标识目标。标识一个目标的方法为：<aname="name">text</a>name属性将放置该标记的地方标记为“name”，name是一个全文唯一的标记串，text部分可有可无。这样，就把放置标记的地方做了一个叫做“name”的标记。做好标记后，可以用下列方法来指向它：<ahref="url#name">text</a>url是放置标记的html文件的urlname是标记名。对于同一个文件，可以写为：<ahref="#name">text</a>这时就可以点取text跳转到标记名为name的部分了。3.4.4目标窗口如果希望被指向的目标在一个新的窗口中显示，可以使用target属性来修饰链接指针元素。如：<ahref="url"target="window-name">text</a>可将url代表的资源显示在一个新的窗口中，该窗口的名字叫window-name，它可以是本窗口（_self）、父窗口（_parent）、新窗口（_blank）及整个浏览器窗口（_top）。

3.4.5图像链接指针图像也可以做为链接指针。格式为：<ahref="url"><imgsrc="url"></a>可以看出，上例中用<imgsrc="url">取代了链接指针中text的位置。<imgsrc="url">是图像元素，它表明显示url代表的图像文件。下面是一个简单的图像链接指针。<ahref="www.edu.cn">中国教育和科研计算机网<imgsrc="edu.gif"></a>3.4.6图像地图（imagemap）

上面介绍的图像链接指针每幅图只能指向一个地点，而图像地图可以把图像分成多个区域，每个区域指向不同的地点。这样，就可以用图像地图编写出很漂亮的html文件。使用图像地图稍微复杂一点。图像地图不仅需要在html文件中说明，它还需要一个后缀为.map的文件，用来说明图像分区及其指向的url的信息。在.map文件中说明分区信息的格式如下：

rect url左上角坐标，右下角坐标poly url各顶点坐标circleurl直径两端点坐标defaulturlrect指定一个矩形区域，该区域的位置由左上角坐标和右下角坐标说明。poly指定一多边形区域，该区域的位置由各顶点坐标说明。circle指定一圆形区域，该区域的位置由垂直通过圆心的直径与该圆的交点坐标说明。default指定图像地图其它部分的url。坐标的写法为：x，y，各点坐标之间用空格分开。下面是一个完整的说明文件：default：http://www.edu.cnrect：http://www.ibm.com140,20280,60poly：http://www.microsoft.com180,80200,140circle：80,14080,100图像地图需要一个特殊的处理程序imagemap。imagemap放在/cgi-bin中。在html文件中引用图像地图的格式为：<ahref="/cgi-bin/imagemap/mymap.map"><imgsrc="mymap.gif"ismap></a>可以看出这是一个包含图像元素的链接指针元素。图像元素指明用于图像地图的图像的url，并用Ismap属性说明。需要说明的是链接指针中的href属性，它由两部分组成：第一部分是/cgi-bin/imagemap，它指出用哪个程序来处理图像地图，必须原样写入；第二部分是图形地图的说明文件mymap.map。/cgi-bin/imagemap/mymap.map绝不表示mymap.map在/cgi-bin/imagemap目录中。在netscape扩展中，图像地图可以用一种比较简化的方式来表示，这就是客户端图像地图。用户端地图可以将图像地图的说明文件写在html文件中，而且不需要另外的程序来处理。这就使html作者可以用同别的元素相一致的写法来写图像地图。用户端图像地图的格式为：<imgsrc="url"usemap="#mymap">src="url"用于指定用作图像地图的图像。usemap属性指明这是客户端图像地图。其中的“#mymap”是图像文件说明部分的标记名，浏览器寻找名字为mymap的<map>元素并从中得到图像地图的分区信息。客户端图像地图的分区信息用<mapname=mapname>元素说明，name属性命名<map>元素。图像地图的各个区域用<areashape="形状"coords="坐标"href="url">说明，形状可以是：rect矩形，用左上角，右下角的坐标表示，各个坐标值之间用逗号分开；poly多边形，用各顶点的坐标值表示；circle圆形，用圆心及半径表示，前两个参数分别为圆心的横、纵坐标，第三个参数为半径。href="url"，表示该区域所指向的资源的url，也可以是nohref，表示在该区域鼠标点取无效。客户端图像地图各个区域可以重叠，重叠区以先说明的条目为准，下面是一个例子：<imgsrc="mapimg.gif"usemap="#Face"><mapname="Face"><!TextBOTTON>此行是注释<areashape="rect"href="page.html"coords="140,20,280,60"><!TriangleBOTTON><areashape="poly"href="image.html"coords="100,100,180,80,200,140"><!FACE><areashape="circle"href="nes.html"coords="80,100,60></map>3.5版面风格控制使用HTML可以对Web页面的版面进行控制，比如字体大小、分行、画线、背景和文本颜色等等。3.5.1字体1．字号html有七种字号，1号最小，7号最大。默认字号为3，可以用<fontsize=字号>来设置新的字号。设置文本的字号有两种办法：一种是设置绝对字号，如<fontsize=字号>；另一种是设置文本的相对字号，如<fontsize=±n>。用第二种方法时“＋”号表示字体变大，“－”号表示字体变小。<fontsize=7>size=7:今天天气很好！</font><br><fontsize=6>size=6:今天天气很好！</font><br><fontsize=5>size=5:今天天气很好！</font><br><fontsize=4>size=4:今天天气很好！</font><br><fontsize=3>size=3:今天天气很好！</font><br><fontsize=2>size=2:今天天气很好！</font><br><fontsize=1>size=1:今天天气很好！</font><br>输出结果为：图3-3不同字号的输出结果

2．字体风格字体风格分为物理风格和逻辑风格。物理风格直接指定字体，其字体有黑体<b>，斜体<i>，下划线<u>，打字机体<tt>。逻辑风格用于指定文本的作用。如：

<em>强调<srrony>特别强调<code>源代码

<samp>例子<kbd>键盘输入<var>变量<dfn>定义<cite>引用<small>较小<big>较大<sup>上标<sup>下标3．闪烁<blink>文本</blink>可使文本闪烁，闪烁频率为1秒钟一次。3.5.2横线（hr）横线，一般用于分隔同一文本的不同部分。在窗口中划一条横线非常简单，只要写一个<hr>即可。横线的宽度用<hrsize=n>指定，n是线宽，单位是象素。例：<hrsize=10>。<hrwidth=#>指定横线长度，既可以指定绝对线长，也可以指定横线长度占窗口宽度的百分比。例<hrwidth=50>、<hrwidth=50%>。横线的位置用<hralign=#>指定。#是left或right之一。left表示左端与左边界对齐，right是右端与右边界对齐。默认时，横线出现在窗口中央。3.5.3行间图像行间图像可使网页更加漂亮，但是过大的图像会导致网络通讯量急剧增大，延长访问时间。所以在主页上不宜采用很大的图像。如果确实需要一些大图像，最好在主页中用一个缩小的图像指向原图，并标明该图的大小。这样访问者可以快速地访问你的主页，自己选择看还是不看那些图像。图像的基本格式为：<imgsrc="image-url">或<imgsrc="image-urd"alt="text">image-url是图像文件的url。目前，大部分浏览器支持.gif和.jpg文件，alt属性告诉不支持图像的浏览器用text代替该图。图像在窗口中会占据一块空间，在图像的左右可能会有空白，不加说明时，浏览器将随后的文本显示在这些空白中，显示的位置由align属性指定。用align=left，right时，图像是一个浮动图像。比如align=left，图像必须挨着左边框，它把原来占据该块空白的文本“挤走”，或挤到它右边，或挤到它上下。文本与图像的间距用vspace=#，hspace=#指定，#是整数，单位是像素。前者指定纵向间距，后者指定横向间距。3.5.4分行<br>和禁止分行<nobr><br>表示在此处分行，<nobr>…</nobr>将通知浏览器，其中的内容在一行内显示，若一行内显示不了，则超出部分将被裁剪掉。<brclear=#>中的clear属性标明下一行的情况，如

clear=left，表示下一行从左边界处开始。#可以是left、right、all之一。

3.5.5背影和文本颜色窗口背景可以用下列方法指定：<bodybackground="image-url"><bodybgcolor=#text=#link=#alink=#vlink=#>第一行指定的是填充背景的图像，如果图像的大小小于窗口大小，则把背景图像重复，直到填满窗口区域。第二行指定的是16进制的红、绿、蓝分量。bgcolor：背景颜色text：文本颜色link：链接指针颜色alink：活动的链接指针颜色vlink：已访问过的链接指针颜色例如：<bodybgcolor=FF0000>大红背景色。

注意，此时体元素必须写完整，即用<body>结束。3.5.6转义字将与特殊字符html中<、>及&字符有特殊含义，（前两个字符用于链接签，&用于转义），不能直接使用。要使用这三个字符，必须用它们的转义序列。l

&的转义序列为&s或&；l

<的转义序列为<或<；l

>的转义序列为>或>；前者为字符转义序列，后者为数字转义序列。例如：<font>显示为<font>。若直接写为<font>则会被认为是一个链接签。

需要说明的是：l

转义序列各字符间不能有空格。l

转义序列必须以“;”结束。l

单独的&不被认为是转义开始。如“<”被解释为“<”而不是“<”。另一个需要转义的字符是引号，它的转义序列为“"”或“"”，例如<imgsrc="image.gif"alt="A&quol;real"example">html使用的字符集是ISO8859-1字符集，该字符集中有许多在标准键盘上无法输入的字符。对这些特殊字符只能使用转义序列。3.6表格（Table）3.6.1表格的基本形式一个表由<table>开始，</table>结束，表的内容由<tr>、<th>和<td>定义。<tr>说明表的一个行，表有多少行就有多少个<tr>；<th>说明表的列数和相应栏目的名称，有多少个栏就有多少个<th>；<td>则填充由<tr>和<th>组成的表格。border属性用来说明是否用表格线分开。3.6.2有通栏的表有横向通栏的表用<thcolspan=#>属性说明，colspan表示横向栏距，#代表通栏占据的网格数，它是一个小于表的横向网格数的整数。有纵向通栏的表用<rowspan=#>属性说明。rowspan表示纵向栏距，#表示通栏占据的网格数，应小于纵向网络数。需要说明的是有纵向通栏的表，每一行必须用</tr>明确表示一横向栏目结束,这是和表的基本形式不同的。

3.6.3表的大小、边框宽度及表格间距表的大小用width=#和height=#属性说明。前者为表宽，后者为表高，#是以像素为单位的整数。边框宽度由border=#说明，#为宽度值，单位是像素。表格间距即划分表格的线的粗细用cellspacing=#表示，#的单位是像素。

3.6.4表中文本的输出文本与表框的距离用cellpadding=#说明。表格的宽度大于其中的文本宽度时，文本在其中的输出位置用align=#说明。#是left，center和right三者之一，分别表示左对齐、居中和右对齐。align属性可修饰<tr>,<th>和<td>链接签。表格的高度大于其中文本的高度时，可以用valign=#说明文本在其中的位置。#是top，middle，bottom，baseline四者之一。分别表示上对齐，文本中线与表格中线对齐，下对齐，文本基线与表格中线对齐。特别注意的是基线（baseine）对齐方式，它使得文本出现在网格的上方而不是想象中的下半部。同样，valign可以修饰<tr>，<th>，<td>中的任何一个。3.6.5浮动表格所谓浮动表格是指表与文件中内容对齐时，若在现在位置上不能满足其对齐方式，表格会上下移动，即“挤开”一些内容，直到满足其对齐要求。浮动属性一般由align=left或right指定3.6.6表格颜色表格的颜色用bgcolor=#指定。#是16进制的6位数，格式为rrggbb，分别表示红、绿、蓝三色的分量。或者是16种已定义好的颜色名称，参见文本颜色。3.7分框Frame分框将浏览器的窗口分成多个区域，每个区域可以单独显示一个html文件，各个区域也可相关连地显示某一个内容。比如可以将索引放在一个区域，文件内容显示在另一个区域。分框的基本结构如下:<html><head><title>…</title></head><noframes>…</noframes><frameset><framesrc="url"></frameset></html><noframes>…</noframes>中的内容显示在不支持分框的浏览器窗口中，因而这里需指

向一个普通版本的html文件，以便供使用不支持分框浏览器的用户阅读。分框由<frameset>指定，并且可以嵌套，分区中部分显示的内容用<frame>指定。可以将窗口横向分成几个部分，也可以分成纵向几个部分，还可以混和分框。横向分框用<framesetcols=#>指定，#可以是一个百分数，也可以是一整数。前者规定各框占窗口的百分数，后者指定各框的绝对大小。纵向分框用<framesetcols=#>指定。将窗口分成横纵几个区域时，用<framset>代替<frame>链接即可将原来分好的<frame>区域再次分框。分框与其中的文本间距可以用Marginwidth=#和Marginheigh=#来指定，前者指定文本与分框的边缘的横向距离，后者为纵向距离，其单位都为象素。

3.8特技与多媒体利用HTML中的特殊标记，可以实现简单的特技，如会移动的文字，以及在网页中嵌入多媒体。3.8.1会移动的文字1．语法<marquee>…</marquee>例如：<marquee>从右向左移动的文字</marquee>2．属性（1）方向<direction=#>#=left,right例如：<marqueedirection=left>从右向左移！</marquee><P><marqueedirection=right>从左向右移！</marquee>（2）方式<behavior=#>#=scroll,slide,alternate例如：<marqueebehavior=scroll>一圈一圈绕着走！</marquee><P><marqueebehavior=slide>只走一次！</marquee><P><marqueebehavior=alternate>来回走！</marquee>（3）循环<loop=#>#=次数，若未指定则循环不止(infinite)例如：<marqueeloop=3width=50%behavior=scroll>只走3趟！</marquee><P><marqueeloop=3width=50%behavior=slide>我只走3趟！</marquee><P><marqueeloop=3width=50%behavior=alternate>我只走3趟！</marquee><marqueescrollamount=20>我走得好快哟！</marquee>（4）延时<scrolldelay=#>例如：<marqueescrolldelay=500scrollamount=100>走一步，停一停！</marquee>3．外观设置（1）对齐方式(Align)：<align=#>#=top,middle,bottom＃为对齐上沿、中间、下沿。例如：<fontsize=6><marqueealign=#width=400>我会移动啦！</marquee></font>（2）底色<bgcolor=#>#=rrggbb16进制数码，或者是下列预定义色彩：Black,Olive,Teal,Red,Blue,Maroon,Navy,Gray,Lime,Fuchsia,Green,Purple,Silver,Yellow,Aqua例如：<marqueebgcolor=aaaaee>我会移动啦！</marquee>（3）背景面积<height=#width=#>例如：<marqueeheight=40width

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论