|
几个星期之前,Patrick给我讲了串接样式表的作用,但是到目前为止,我们只是听说了很多,但亲眼看到的很少,俗话说耳听为虚,眼见为实,它真的就象说的那么伟大吗？我从微软的滞纳中没有发现很多样式表的应用实例。这么多人在谈论样式表，却很少看到其应用实例，这多少让我感到有点惊讶。 但是样式表还是一项非常有应用前景的技术。为什么这样说呢？利用样式表，我们可以设定字体字号等等，并且生成更加复杂而且现在更快的网页。而且，它将更便于查询，因为我们可以直接通过图文（typograhy）而无须通过硕大臃肿的图象。但是其结果也有一些我未曾预料到的复杂性。随后我们将具体谈谈这方面的情况。 截止目前，样式表只是InternetExplorer的特色项目，尽管微软的市场份额在不断增长，但网页设计者还不能有足够的理由让自己转向采用这种技术设计网页，因为可以看到其效果的观众还是很有限的。最新的Netscape 4.0可能会应用样式表技术，但windows 3.1的用户可能就得伸长脖子继续等待了。 本文的演示中，我们将展示用样式表制作的3种不同页面，而这些效果标准的HTML是作不到的。就算是管窥未来的小小尝试吧。 你需要配备的软硬件:
制作方法 该展示最关键的部分在于设计出如何使用最少的图象进行页面布局。刚开始的时候，我以为利用样式表将会比较容易地做到这一点，但很快我就发现我必须重新学习以前已经掌握的网页设计内容。 首先,我规划出页面的外观,然后,我以表格的形式确定页面背景,对于黄线那张页面,我使用一系列表格单元及(<td>tags）生成一种背景“图象”的感觉。这张页面无非是黄色、蓝色和红色的表格横栏。 将这些部分拼到一起之后，我在其上写出样式表文字（有点象Photoshop的工作，此时背景就象是Layer 1）。作这些工作时你必须忘记所学国过的网页设计知识，而应以一个印刷设计师的头脑进行思考。由于样式表拓展了HTML的要素（p,h1,body等待），所以无须绞尽脑汁拼凑HTML语言以实现设计目的。（要素的完整索引请查阅微软或World Wide Web Consortium中关于样式表的网页。） 在页面上建立这些要素之后（我使用了color, margin top, -left, -right, -bottom, font size, font-family, weight,及text-decoration），我们必须将这些要素应用到我们的内容中。我通过开发出分类文件利用各种要素详细确定样式。然后我使用<div class = foo>及</div>命令应用这些样式。 所以无论何时我需要应用Comic Sans 75px text，我使用comictext分类。通过应用这种样式到Comic Sans text以产生一种下落阴影的感觉。但是你得注意，你必须首先声明应用这些分类并明确其抵消（offset）模式，否则，这些分类样式不能发挥功能。 我总是试图使用大部分PC机用户都常用的字体：Verdana,Arial,Times New Roman, Courier New, Comic San Ms, Arial Black,及Impact。微软通过其网络版有重新发布了这些字体，并增加了许多字符。Win 95又加入了其它一些，如Symbol,Windings 及Marlett，除了使用这些字体，你还可以使用许多基于符号的字体作为设计要素，这些功能真是太棒了。 速度及适应性 对于速度的考虑是应用样式表的重要原因。页面中放的图象越少，页面下载的速度就越快。就这么简单，比如，在这张黄线图例中，我本可以使用一幅图象作为背景，但是那样的化我必须使用一幅非常大的图象，而图象越大，下载速度就越慢。 新闻报纸这张页面本来需要一幅35kbyte的图象，而那样的话适应性就会受到很大的影响。多亏有了样式表，我可以将其设置为模板，然后只需进入模板，从左到右改变文字，然后如此这般如此这般...你就完成了。 演示页面就是这样做成的。如果利用普通的老式HTML，我必须加入一系列的 GIF图象，从而加大文件体积，使得查询变得非常困难。而利用样式表不仅可以下载的更快，而且还可从中查找任何词汇，并打开包含该词汇的页面。 从技术上讲，这些还算不上串接样式表，因为它们只是单篇的页面。但是，将这些规格(specs）从该页面中抽出，变成单另的.css文件，然后如此这般如此这般，它们就是串接样式了。
|