HTML的新功能

 
  HTML总是在发展,甚至每天都有新的技术出现,这确实是令人兴奋的。但如果你只是一个用HTML编辑器来做主页的普通主页制作者,你就无法感受到兴奋,因为任何一个HTML编辑器都不可能随时支持总在变化的HTML的新功能。

由于浏览器支持特性的不同,有的新功能就不能迅速普及,但是有经验的编程人员总能在编程时通过对浏览器的自动识别,使用它们能支持的新功能,来展示自己独特的设计能力。

在HTML中插入JavaScript或VBScript已经是以前的事了,而微软的WebTV也因硬件原因成为昨日黄花。 当然插件已经不是HTML的范围了,我要向大家介绍的是一些旭日初升、前景美妙的新功能。

CSS(层叠式样表)

我之所以要首先介绍层叠式样表,是因为目前两大主要浏览器IE4和NN4都开始对它支持,虽然它们之间仍有一些差异,但正在向统一迈进,在HTML中使用层叠式样表,至少有百分之九十以上的浏览者能感受到这一新功能,这是目前HTML中最佳的增强功能。

CSS 的发展已经有几年的历史了,然而真正广泛应用的还是在IE4和NN4这两个主要浏览器的支持下才迅速普及的。目前的标准是CSS1,它的功能主要有以下几个方面:

★可以使多个页面,设计者不必为每个页面进行逐行的格式化,只要按预先提供的式样表进行格式化就可保持页面的统一风格。

★可以使不同环境中创建的页面保持相同的风格。

★只须更新预先定义的式样表,就可使所有链接这个式样表的页面得到同步更新。

当然,它所提供的特殊效果,也是一个新的功能。

我们可以这样来理解CSS ,相信大家都用过MS-Word 吧,它对一般文档都提供了模板,你可以对这个模板进行冗余格式化,设定文本和图形的所有参数,于是你创建的每个文档就有了你预先定义的同一种风格。CSS 就是一种风格(规则)列表,它由两部分组成:

★HTML式样元素:即选择器。

★声明:即属性和值的列表,简称属性和值。

当然有的选择器是没有值的,只有属性形式的通、断开关。我们先来看一下下面这个例子:

H2 { COLOR:RED

FONT-SIZE:12PT;

FONT-FAMILY:ARIAL;

FONT-STYLE:NORMAL;

}

这个例子中我们将几个声明同时放列表中,最多可以同时设定五十个声明,你可以把这个列表定义为扩展名为CSS 的文件,然后在任何一个页面中调用它,基本语法为:

〈HEAD〉

〈LINK REL=STYLESHEET TYPE=″text/css″ HREF=″
your-css-files-path/your-css-files″ TITLE=″your
-styles″〉

〈/HEAD〉

当然你也可以在HEAD标记中直接使用CSS 标记:

〈HEAD〉

〈STYLE TYPE=″text/css″〉H2
{COLOR:RED}〈/STYLE〉

〈/HEAD〉

你还可以在保留被调用的外部式样表的同时改变文档中的各个元素的显示方式,就是CSS 的局部(行间)调用:

〈DIV ALIGN=″left″ STYLE=″Modern″〉This text
is aligned right and uses an element from a CSS1
style sheet.〈/DIV〉

大体上,CSS 的调用有四种方法:

★LOCAL:用于使用STYLE属性的页面中的一个标记。

★GLOBAL:用于使用HEAD标记中的STYLE标记的任何页面中的所有标记。

★LINKED:用于多个页面并使用LINK标记。

★IMPORTED:允许多个式样表在同一HTML页面中应用。

关于CSS的详细信息你可能访问它的站点:

http://www.htmlhelp.com/reference/css/。

LAYER和ILAYER(层)

层是一个非常有趣的新功能,就像PhotoShop中的层一样,它可以重叠显示Web的内容,注意是重叠而不是覆盖。可惜目前只有NN4 才支持它,相信目前至少有百分之六十的人在使用NN4 吧。

运用LAYER 和ILAYER,我们可以对包含文本和图形的对象进行强制定位,在已经调用的图形所在的区域内添加文本和图形,这不仅仅是覆盖,如果你调用的是透明图形你就知道这是一种“合并”的效果了。(如果你使用的是NN4,去网景公司的主页看看那种效果吧)。

层的语法标记为:

〈LAYER ID=″yuor-id″ TOP=″xxx″ LEFT=″xxx″〉

一般的HTML语句;

〈/LAYER〉

LAYER和ILAYER语句的区别是:LAYER是把它所包含的HTML语句作为一个绝对层来处理,这个层上的任何功能都能像单页上的功能得到实现,而ILAYER标记只是一个相对层,它的位置和包含的HTML功能都和其它层有关。

层的标记所使用的属性和功能如下:

★ID:设定层的ID或NAME。

★LEFT和TOP:设定层对象的左上角的相对位置。

★PAGEX和PAGEY:设定绝对层在页面上相对页面边缘的位置。

★SRC:层中显示的内容。

★X-INDEX、ABOVE和BELOW:设定该层和其它层的相对位置。

★WIDTH:设定层上内容的换行位置。

★CLIP:设定层的可视区域。

★HEIGHT:设定被剪切的内容的最高点。

★BGCOLOR和BACKGROUND:如同它们在单页面上的功能一样。

当然还有几个JavaScript事件句柄因篇幅因原就不再介绍,有兴趣的朋友可以去网景公司的主页了解详细信息。

动态字体

动态字体是浏览器在下载HTML文档时把文档中设定的字体一同下载,以便能取得预定显示效果的一种增强特性。这样即使你的计算机中没有安装Web设计者所调用的字体,也能正确地显示他所设计的效果。

设定下载字体的方法有两种,一种是在CSS 中定义字体文件,浏览器就会引用该文件来找出需要下载的字体文件,当然你的字体文件一定要先放在服务器上。另一种方法就是用LINK标记来设定下载的字体文件:

〈LINK REL=″fontdeffile″ SRC=″http://your-
fonts-path/contentfont.pfr″〉

在你的浏览器下载文档时字体文件就会随即被下载,这种效果大家可以看看清华大学的主页,那个欢迎的JAVA中就是调用动态字体,效果非常漂亮。不过我还是在去年看的,现在不知是否已经被更新了。

值得一提的是NN4 中还可以用POINT_SIZE和WEIGHT来设定字体的磅值和粗细。在CSS 的主页上FONT一节中有详细介绍。

FRAME(帧)

帧其实不能算是一新功能,我之所以要把它作为一项新功能来介绍,是因为它并没有被很好地利用,并且它确实有了新的发展。

帧的出现为单一的页面带来了活力,使你能对你的页面进行任意的布局格式化。很多文章介绍帧的使用,最好不要超过3个,不过我认为,帧的多少并不是关键,关键在于你能够合理地安排它们。

IE所支持的IFRAME(独立帧)其实并没有人使用,它就是在页面上开一个可滚动的窗口,既不实用,又不美观,我目前只是自己试验过,还没见过哪位作者真的用它。

HTML的新标准中,帧的TARGET属性的值现在有了新的内容:

BLANK:将内容加载到新开的空窗口中。

PARENT:将内容显示到父窗口中。

SELF:将内容显示在本窗口中。

TOP:将内容加载到窗口中,显示浏览器的查看空间。

使用TARGET属性的好处是保证你的主页的可视性,因为你的主页很可能被链接到本来就有帧的页面,而你洋洋得意设计的整个页面就成了人家的页面上的局部,尤其是你又采用了无边界帧,你的页面上的许多东西就不能显示出来,更别说效果了,简直是目不忍睹。所以你最好做一个无帧的提示页做为链接,再在提示页上链接你的正页,用TARGET属性来开一个满屏的新窗口显示它,才能保证你的页面的完整,这是一个技巧。
 

back1.gif (11020 字节)