Question

好的，这有点令人困惑。我不确定它只是我或者XSLT是否更加局限于CSS，因为我无法在CSS中设置一半的样式。

目前，我有一些XML数据，它链接到XSL文档。在我的XSL文档中，我有一个LI菜单，以及来自XML的所有产品都显示完美。问题是，我想设置我的LI菜单，所以我将它链接到外部CSS样式表。一旦我将XSL链接到样式表，一切都会消失，它就变成了一堆文本。

这是不可能的吗？

<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform
<xsl:template match="/">
<html>
<head>
<style>
ul
{
float:left:
width:100%;
padding:0;
margin:0;
list-style-type:none;
}
a
{
float:left;
width:6em;
text-decoration:none;
color:white;
background-color:blue;
padding:0.2em 0.6em;
border-right:1px solid white;
}
a:hover {background-color:#ff3300;}
li {display:inline;}
</style>
</head>
<body>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">VRM Checker</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
  <body>
  <h2>BMW X6 Available Parts</h2>
<table border="1">
  <tr bgcolor="#9acd32">
    <th>Products</th>
    <th>Description</th>
<th>Suitability</th>
<th>Caution</th>
<th>Price (In GBP)</th>
  </tr>
  <xsl:for-each select="catalog/cd">
  <tr>
    <td><xsl:value-of select="Products"/></td>
    <td><xsl:value-of select="Description"/></td>
    <td><xsl:value-of select="Suitability"/></td>
    <td><xsl:value-of select="Caution"/></td>
    <td><xsl:value-of select="Price"/></td>
<td><img src="{image}"></img></td>
</tr>
  </xsl:for-each>
</table>
  </body>
  </html>
</xsl:template>
</xsl:stylesheet>

XML

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="car.xsl"?>
<catalog>
<cd>
    <Products>X6 Front Bumper</Products>
    <Description>Stylized X6 Bumper from Hamman. Production and aero tested for agile performance and improved aerodynamics. Included are LED fittings and LED strips</Description>
    <Suitability>USA</Suitability>
    <Caution>Columbia</Caution>
    <Price>£106.90</Price>
<image><src>http://www.carid.com/images/aero-function/hood/108726-2.jpg</src></image>
</cd>
</catalog>

Answer 1

听起来你对XSLT与CSS的角色相比有点困惑。

XSLT是一种功能强大的通用工具，可以采用一种形式的XML并将其转换为另一种形式，在这种情况下可能是XHTML（这是一种XML形式）。

CSS通常用于 HTML 的样式设置（尽管您可以 style the XML directly）。

当你说“链接到XSL”时，我推断你正在使用浏览器为你做转换（而不是在脚本/应用程序中）。

没有源代码就很难诊断出任何东西，但我猜想通过添加CSS链接你已经以某种方式使XSL转换无效（或者只是让它什么都不做，以便使用XML的默认呈现，因此，“一堆文字”）。

您可能希望确保CSS声明出现在XSLT的输出的正确部分，即生成的XHTML的<head>部分。

更新

现在检查源代码，XSLT是无效的XML：

<xsl:stylesheet...似乎没有关闭引号和标记，但可能是复制粘贴问题
打开了两个<body>标签（<h2>之前的错误标签）。

修复这些使它对我有用......

Answer 2

您的XSLT样式表（“car.xsl”）应如下所示：

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" version="1.0" encoding="utf-8" indent="yes"/>

<xsl:template match="/">
<html>
<head>
    <link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>
<body>
<ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">VRM Checker</a></li>
    <li><a href="#">Products</a></li>
    <li><a href="#">Contact Us</a></li>
</ul>
<h2>BMW X6 Available Parts</h2>
<table>
    <thead>
        <tr>
            <th>Products</th>
            <th>Description</th>
            <th>Suitability</th>
            <th>Caution</th>
            <th>Price (In GBP)</th>
        </tr>
    </thead>
    <xsl:for-each select="catalog/cd">
        <tr>
            <td><xsl:value-of select="Products"/></td>
            <td><xsl:value-of select="Description"/></td>
            <td><xsl:value-of select="Suitability"/></td>
            <td><xsl:value-of select="Caution"/></td>
            <td><xsl:value-of select="Price"/></td>
            <td><img src="{image}"></img></td>
        </tr>
    </xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>

然后将所有“优质CSS样式”放在上面的XSLT样式表中引用的“mystyle.css”文档中。

当然，你也可以将CSS放在XSLT样式表本身中 - 就像使用HTML文档一样。

将XML与XSL链接到CSS？

2 个答案:

更新