Question

我正在尝试将样式应用于Label属性的以下XML代码

<NavItem Description="" id="client1" Label="My Information"  SequenceNumber="3" ></NavItem>

这是XSL代码

<h3 title="{@Description}">
  <a href="#">
    <img src="{$imgSrc}" />
    <xsl:value-of select="@Label"/>
  </a>

使用上面的XSLT代码，我从label获取值作为输出，但我不知道如何将CSS应用于Label。

请帮助我

谢谢＆amp;问候马哈德

Answer 1

您需要将值包装在HTML元素中，例如

<span class="label"><xsl:value-of select="@Label"/></span>

然后，您可以使用常规CSS添加合适的link元素（引用外部CSS样式表）或style部分中的head元素，例如

<style>
.label { font-size: 80%; font-family: Calibri, sans-serif }
</style>

作为一种结构较少的方法，有时候在最简单的情况下是合适的，你可以选择使用style属性中嵌入的CSS样式表：

<span style="font-size: 80%"><xsl:value-of select="@Label"/></span>

Answer 2

一个简单的“Hello XSLT”示例：的hello.xml

<?xml version="1.0"?>
 <?xml-stylesheet href="hello.xsl" type="text/xsl"?>
  <page>
   <title>Hello</title>
   <content>Here is some content</content>
   <comment>Written by DKS.</comment>
</page>

通缉结果文件

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
 <html>
   <head>
     <title>Hello</title>
   </head>
   <body bgcolor="#ffffff">
     <h1 align="center">Hello</h1>
     <p align="center"> Here is some content</p>
     <hr><i>Written by DKS</i>
   </body>
 </html>

XSLT样式表

hello.xslt

<?xml version="1.0"?>                
 <xsl:stylesheet version="1.0"
                 xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

 <xsl:template match="page">
    <html> 
      <head> 
        <title> <xsl:value-of select="title"/>
      </title>
     </head>
     <body bgcolor="#ffffff">
      <xsl:apply-templates/>
     </body>
    </html>
   </xsl:template>

   <xsl:template match="title">
    <h1 align="center"> <xsl:apply-templates/>  </h1>
   </xsl:template>

   <xsl:template match="content">
    <p align="center"> <xsl:apply-templates/> </p>
   </xsl:template>

   <xsl:template match="comment">
    <hr/> <i><xsl:apply-templates/> </i>
   </xsl:template>
 </xsl:stylesheet>

了解更多信息。见这里.. http://edutechwiki.unige.ch/en/XSLT_Tutorial_-_Basics

更新

要将XML文件链接到CSS，请使用以下代码：

然后在yourstyle.css中编写你的css代码：例如：

label {
display: block;
font-weight: bold;
margin: 5px;
width: 225px;
text-align: right;
background: #dedede;
}

将样式应用于xml属性值

2 个答案: