日期:2014-04-03  浏览次数:20557 次

   样式表是网页设计的重要部件。由于得到 Microsoft Internet Explorer 4.0 和 Netscape Navigator 4.0 的认可,样式表已经成为可用的排版和设计工具。这两种浏览器都有限地(不完整)支持由 Cascading Style Sheet 1.0 制定的 World Wide Web Consortium. 标准。在设计时,样式表可以使您完整地控制网页上文字元素的表现,为您带来几乎与出版业的设计一样的多灵活性。

本文向您介绍创建和使用样式表的基本内容,以及跨浏览器兼容问题和样式表在 Web 上的发展趋势。假定您已掌握了基本的 HTML 知识。

基本内容

样式表只是一个格式化命令的列表,它使您可以在简单 HTML 命令(如 标记)的基础上控制网页的外观。样式表的概念并非全新的,它们来自文字处理器和排版软件。页面上的每个元素,从个别字符到整个页面均可通过样式表中包含的信息来单独定制格式。

在 Web 上,由于存在多种不同类型 浏览器,所以排版上有许多限制。并且每个浏览器仅有限地支持样式表。用在 Web 上的样式表被成为层叠样式表 (CSS),其被 W3C 所认可的最新版本是 2.0。然而,象这里写的一样,没有浏览器 100% 地支持 CSS 1.0 和 2.0 版。本文将集中介绍 CSS 1.0 版 - 不用担心它会被淘汰,因为 2.0 版完全向下与 1.0 版兼容。

您可以创建的最简单的样式表被称作"嵌入样式表"。它可以直接被放置或写在到您要用的 HTML 文档中,该网页的结构如下所示:






.....

现在您看到了样式表的样子,我们来解析它并为您解释每个部件。


该标记包含了被调用的样式表信息,不奇怪, 标记结束)。这个特殊的标记必须出现在 标记之间,以使其能够被大多数的浏览器解析。在这个开放标记的声明中,必须包含两个属性: 属性告诉浏览器要使用的样式表的格式 (在此例中,可用的类型是"text/CSS"),而 media属性告诉浏览器显示介质是显示器(屏幕)还是打印页面(印刷品);但对当前的浏览器来说,该值只代表"屏幕"。

 

我刚才添加的这两个 标记行的上边。注释不是必须的,但添加注释是好的编码习惯;理由是注释行可以在用户使用旧浏览器(两大公司的 3.0、2.0 和 1.0 系列)查看网页时,可以使样式表数据不被显示出来。旧浏览器会自动略过它们无法识别的标记,但由于在