当前页面位置: » 丰搜网 » 文档中心 » 详细内容
xml之css和xsl精解(1)
css（叠层样式表）和xsl（可扩展样式语言）都可以定义xml文件的显示，这两种方式有哪些不同以及它们在使用中的具体方法，我们将在本文给予介绍。
在xml文件中，使用的基本上是自定义的标记，显然一个浏览器是无法理解这些标记的，现在，浏览器仅仅是作为一个xml文件的解析器?只要你的xml文件是well-formed的，那么它就将文件原封不动地给你显示出来。在xml中内容与表现形式是分开的，在一个xml的源文件中并没有关于它表现形式的信息。xml的最大特点就是揭示了信息本身的含义，用于自动化的电子文档交换是最优的，如果一个xml文件仅仅用于交换信息，就无需考虑它的显示问题。编辑xml文件，我们仅仅需要关注文件的内容、信息的结构，至于它怎么显示，则交给css（叠层样式表）和xsl（可扩展样式语言）来完成。这就使得用户可以根据需要来定义数据的表现形式。
用css来表现xml
css在html中已经有很好作用，在xml中，css同样发挥了它强大的样式表作用。在xml中的css和html中的css差不多。目前的版本是css2.0。
我们先来看一段css的代码??例1中的first.css。它是为例1中2.xml这个xml文件所作的css文件。
在2.xml这个xml文件的源文件中，有一行：〈?xml-stylesheethref="first.css"type="text/css"?〉，它指明这个xml文件在显示的时候引用css文件，具体的语法如下：〈?xml-stylesheethref="url"type="text/css"?〉其中，xml-stylesheet是关键字，表明引用样式表设定；href="url"用来指定样式表所在的位置，在例1中，因为first.css和2.xml在同一个目录下，所以可以直接写出它的名称，是相对地址；type="text/css"表示该样式表是css的样式表。应用css前，浏览器显示如图1，应用了样式表后，显示效果如图2所示。
下面我们来分析例1中first.css这个文件。大家可以看到，在xml中的css和html中的css语法上实际是一样的。都是通过一些标记来设置标记文字怎样显示。
对照表1和表2，来分析这个文件。在这个文件中，每一个区块是针对xml文件中不同的标记来设定的，每个区块用{}符号分割开。像第一个区块，设置了title标记中文字的颜色（color）、显示状态（是否分段：block或inline；隐藏不显示出来：none）、字型（font-family）、大小（font-size和font-weigh）、有无上/下划线（text-decoration）。其他区块，大家可以对照表中的一些常用属性来分析。我们可以利用css的各种属性组合出丰富多彩的显示效果。这和编程关系不大，因为语法太简单了，关键看你的想像力了。
对于同一个xml文件，如果我们赋予它不同的css，那么它就有不同的显示效果，如果你的网页用xml来制作，那么为了变换网页的样子，就可以编辑多个css文件，隔段时间更换。只需要在xml文件的前面改变“url”指定的css文件就可以。
用xsl来表现xml
xsl（可扩展样式语言）也是一种显示xml文件的规范。和css不同的是：xsl是遵循xml的规范来制定的。也就是说，xsl文件本身符合xml的语法规定。xsl在排版样式的功能上要比css强大。比如：css适用于那些元素顺序不变的文件，它不能改变xml文件中元素的顺序?元素在xml文件中是什么顺序排列的，那么通过css表现出来顺序不能改变。对于那些需要经常按不同元素排序的文件，我们就要用xsl。
xsl是怎样工作的呢？xml文件在展开后是一种树状结构，称为“原始树”，xsl处理器（现在只有ie5支持xsl，在ie5中的处理器叫：xslstylesheetprocessor）从这个树状结构读取信息，根据xsl样式的指示对这个“原始树”进行排序、复制、过滤、删除、选择、运算等操作后产生另外一个“结果树”，然后在“结果树”中加入一些新的显示控制信息，如表格、其他文字、图形以及一些有关显示格式的信息。xsl处理器根据xsl样式表的指示读取xml文件中的信息，然后再重新组合后转换产生一个well-formed的html文件。浏览器显示html文件肯定是没问题的，这样，xml文件中的信息就会以一定的形式显示在我们面前了。
同样，我们先来看一个xsl的例子，再来分析它的结构和语法。
xml源文件和xsl源文件如例2所示，显示效果如图3。可以看到，要想
xml文件使用xsl来表现，在
xml文件前面要加上一句：〈?
xml-stylesheethref="url"type="text/xsl"?〉,和引用
css是一样的，只不过是指定type="text/xsl"。
看看xsl文件，可以发现xsl文件的结构和
xml文件的结构是一样的，因为xsl的规则是根据
xml的规则制定的。一个xsl文件也必须是well-foemed的，因为xsl文件中所用的标记都是w3c定义好的。所以，xsl文件就不需要dtd了。另外，可以看到在xsl文件中可以插入一些
html的标记，来帮助
xml文件的显示，这些
html的标记也必须是well-formed的，例如：必须要有正确的结束标记（不能像在
html文件中那样可以偷懒了）。
xsl文件本身即是一份
xml文件，所以在xsl文件的开头，一样有和
xml文件相同的声明。w3c为xsl定义了很多标记（元素），xsl文件就是这些标记和
html标记的组合。在xsl文件中，必须有：〈xsl:stylesheet
xmlns:xsl="http://www.w3.org/tr/wd-xsl"〉。
其中，xsl:stylesheet是xsl文件的根元素，在根元素中包含了所有的排版样式，样式表就是由这些排版样式组合成的；
xmlns:xsl="http://www.w3.org/tr/wd-xsl"这一句主要用来说明该xsl样式表是使用w3c所制定的xsl，设定值就是xsl规范所在的url地址。
xsl文件中，除
html标记外，其他就是xsl自己的标记了。标记有不同的功能。下面介绍xsl中各种可用的标记，大家可以参照它们的功能说明与使用举例，来看看例3中xsl的源文件。
1.xsl:stylesheet：作为xsl样式表中的根元素，在每个xsl文件中都必须有。
属性：default-space：决定是否保留
xml文件中的空白，仅当值为“default”时保留。
indent-result：决定是否保留xsl文件中的空白，值为“yes”时保留。
language：设定在xsl文件中使用的脚本语言。
例：〈xsl:stylesheetdefault-space="default"〉
2.xsl:template：指定
xml文件中的特定标记来定义排版样式。
属性：language：指定使用哪种脚本语言。
match：设定从
xml文件中哪个标记开始来读取信息，如果值为“/”那么表示从
xml文件的根元素开始读取信息。
例：〈xsl:templatemach="data/book"〉：表示从
xml文件中的〈book〉标记开始读取信息。
3.xsl:value-of：从
xml文件中的特定标记中将信息读出来。属性：select：设定读取哪一个标记中的信息。
例：〈xsl:templateselect="title"〉：表示要从〈title〉标记中将信息读出来。
图3
4.xsl:for-each：将排版样式应用到xml文件中相同的标记（类似于循环语句）。
属性：select：设定从哪一个标记中读取数据。
order-by：在读取信息完成之后，设定依据什么标记来进行排序，值为某一特定标记，如在标记名前用“+”号表示是由大到小的排序，反之用“-”号。例：〈xsl:for-eachselect="data/book"order-by="-price"〉：因为在xml文件中有多个〈book〉标记，这里设定重复地从〈book〉标记下的子元素中读取信息，将读出来的信息按照价格从小到大进行排序显示。
5.xsl:comment：在此元素中的内容，xsl将它作为注释信息，并不显示在浏览器中。
6.xsl:apply-templates：指示xsl处理器在该xsl样式表中寻找合适的〈xsl:template〉中设定的样式来用。
属性：order-by和select：同xsl:for-each中的属性一样。
例：.......
〈tr〉〈xsl:apply-templates/〉〈/tr〉
..........
〈xsl:templatematch="book"〉
〈td〉〈xsl:value-ofselect="author"/〉〈/td〉
〈/xsl:template〉
.........
7.xsl:copy：从xml文件中拷贝标记中的信息到输出的文件中。无属性。
例：.......
〈xsl:template〉
〈xsl:copy〉
〈xsl:value-of/〉
〈/xsl:copy〉
〈/xsl:template〉
...........
此例首先使用〈xsl:copy〉将xml文件中的非标记的信息全部读取出来，然后通过〈xsl:value-of/〉将这些复制的信息显示出来。
