XML入门教程：CSS样式表-XML/XSLT

简介

本教程介绍如何使用CSS样式表在XML/XSLT文档中添加样式。CSS（层叠样式表）是一种用于指定文档格式和布局的文件，它可以应用于Web文档、PDF文件、电子书等多种文档格式。

本教程将演示如何在XML文档中使用CSS样式表来定义元素样式、类样式和ID样式，并介绍如何在XSLT文档中将CSS样式表应用到XML文档中。

定义CSS样式

在CSS样式表中，可以定义元素样式、类样式和ID样式。

元素样式

元素样式定义了所有元素的通用样式。在CSS样式表中，可以使用元素名称来定义元素样式。

例如，下面的样式将为所有p元素定义一个红色的前景色和12像素的字体大小：

p {
    color: red;
    font-size: 12px;
}

类样式

类样式定义了共享相同属性的元素的样式。在CSS样式表中，可以使用类选择器（以点号开头）来定义类样式。

例如，下面的样式将为class属性值为“highlight”的所有元素定义一个黄色的背景色和粗体字体：

.highlight {
    background-color: yellow;
    font-weight: bold;
}

ID样式

ID样式定义了唯一元素的样式。在CSS样式表中，可以使用ID选择器（以井号开头）来定义ID样式。

例如，下面的样式将为id属性值为“main”元素定义一个灰色的背景色和16像素的字体大小：

#main {
    background-color: gray;
    font-size: 16px;
}

将样式应用到XML文档

要将CSS样式表应用到XML文档中，可以使用<?xml-stylesheet?>指令。

例如，下面的指令将样式表文件（file.css）应用到XML文档中：

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="file.css"?>
<example>
    <h1>标题</h1>
    <p class="highlight">这是一个带有highlight类的段落。</p>
    <div id="main">这是一个带有main ID的div。</div>
</example>

上述代码将使用file.css样式表文件中定义的样式来格式化XML文档中的元素。

示例1：应用元素样式

下面是一个XML文档，它包含了一个p元素和一个div元素。我们可以通过定义元素样式，来为这些元素应用样式：

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="file.css"?>
<example>
    <h1>标题</h1>
    <p>这是一个段落。</p>
    <div>这是一个div。</div>
</example>

然后，在file.css文件中定义元素样式，如下所示：

p {
    color: red;
    font-size: 12px;
}

div {
    color: blue;
    font-size: 16px;
}

这样就可以为XML文档中的p元素应用红色字体和12像素字体大小，为div元素应用蓝色字体和16像素字体大小。

示例2：应用类样式和ID样式

下面是一个XML文档，它包含了一个带有highlight类的p元素和一个带有main ID的div元素。我们可以通过定义类样式和ID样式，来为这些元素应用样式：

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="file.css"?>
<example>
    <h1>标题</h1>
    <p class="highlight">这是一个带有highlight类的段落。</p>
    <div id="main">这是一个带有main ID的div。</div>
</example>

然后，在file.css文件中定义类样式和ID样式，如下所示：

.highlight {
    background-color: yellow;
    font-weight: bold;
}

#main {
    background-color: gray;
    font-size: 16px;
}

这样就可以为XML文档中的带有highlight类的p元素应用黄色背景色和粗体字体，为带有main ID的div元素应用灰色背景色和16像素字体大小。