将 CSS 样式添加到 <xsl:element name= "standard_element_name" >



根据SO标准,我在谷歌和雅虎,W3Schools和其他论坛上研究了这个问题几个小时,然后才在这里发帖。到目前为止,我找到的所有答案都是针对专门的XML语言和其他将要读取XML文件的应用程序的。我没有这样做,也没有编写任何其他类型的代码(如C++、Java、C#等;我也不想使用JavaScript)。

我正在创建的本地小网站只使用HTML、XML和XSL中的文件,并且使用了大量存储为.jpg和png的图像文件。没有别的了。

我的小网站运行在一台基于Windows 10的本地电脑上,并启用了IIS。该网站正常工作,其他计算机可以通过局域网在常见的网络浏览器(如FireFox和Chrome)中查看。

唯一的问题是我的编码。

我的项目是创建一个非常基本的静态网站,输出简单的HTML,只使用XML和XSLT。

我有一个XSL文件,它定义了模板中的所有标准HTML标记[例如(p)(div)(table)(tr)(th)(td)等]。我还有许多自定义标记,这就是我想要使用XML的原因。)

我已经到了想要使用(xsl:element name=")的地步。例如,我想使用(xsl:element name="p")定义一个典型的HTML(p style="color:yellow;")。

下面是我已经拥有的xsl的一个小示例:

<xsl:element name="p">
<xsl:value-of select="p" />
</xsl:element>

这是可行的,并且在输出中创建了一个非常简单的(p)标记,并显示所有文本。但是,它没有造型。在浏览器输出中,它看起来像这个

<p>
A paragraph of text in here.
</p>

在解释了上面的内容之后,我的问题是(希望非常清楚),如何使用上面显示的(xsl:element name="p")为其添加样式属性,使我的HTML输出看起来像这样:

<p style="background-color:yellow; font-size: 16pt;">
A paragraph of text in here, which is now black on a yellow background and a 16 point font.
</p>

我已经回答了自己的问题,并为其他可能对此感到困难的人提供了完整的、实际的XSLT和一些XML文件。简短的答案是(xsl:element name="div")正下方的(xsl:attribute name="style")。

我已经包含了完整的代码,它在左侧的输出中创建了一个(div),它保持在固定位置(意味着它不滚动)。这是一个空间,用于列出用作菜单的其他章节的链接。以(xsl:element name="div")开头、以结束标记(.xsl:element)结尾的短代码创建该区域,(for each)块读取所有(list text)和(url)标记[(side_menu_div)标记的子项,然后在侧面的(div)区域中创建一个链接列表。

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

<xsl:template match="ROOT">
<html>
<head>
<xsl:element name="title">
<xsl:value-of select="title" />
</xsl:element>
</head>
<body style="background-color:#fffc99;">
<xsl:element name="div">
<xsl:attribute name="style">width: 10%; height: 100%; position: fixed; padding-right: 1em; background: white</xsl:attribute>
<xsl:for-each select="/ROOT/side_menu_div/link-text">
<xsl:variable name="index" select="position()" />
<a href="{/ROOT/side_menu_div/url[$index]}">
<xsl:value-of select="." />
</a>
<br/>
</xsl:for-each>
</xsl:element>  
</body>
</html>
</xsl:template>
</xsl:stylesheet>

实际的XML

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="/style-sheets/master.xsl"?>
<ROOT>
<title>Player's Core Rulebook</title>

<side_menu_div>
<link-text>Home Menu</link-text>
<url>/methasia_index.html</url>
<br></br>
<link-text>Preamble</link-text>
<url>/rulebooks/_players_core_rulebook/00-Preamble/Preamble.xml</url>
<link-text>Chapter 1</link-text>
<url>/rulebooks/_players_core_rulebook/01-Chapter-01/chapter_1.xml</url>
<link-text>Chapter 2</link-text> 
<url>/rulebooks/_players_core_rulebook/02-Chapter-02/chapter_2.xml</url>
<link-text>Chapter 3</link-text> 
<url>/rulebooks/_players_core_rulebook/03-Chapter-03/chapter_3.xml</url>
<link-text>Chapter 4</link-text> 
<url>/rulebooks/_players_core_rulebook/04-Chapter-04/chapter_4.xml</url>
<link-text>Chapter 5</link-text> 
<url>/rulebooks/_players_core_rulebook/05-Chapter-05/chapter_5.xml</url>
<link-text>Chapter 6</link-text> 
<url>/rulebooks/_players_core_rulebook/06-Chapter-06/chapter_6.xml</url>
<link-text>Chapter 7</link-text> 
<url>/rulebooks/_players_core_rulebook/07-Chapter-07/chapter_7.xml</url>
<link-text>Chapter 8</link-text>
<url>/rulebooks/_players_core_rulebook/08-Chapter-08/chapter_8.xml</url>
<link-text>Chapter 9</link-text> 
<url>/rulebooks/_players_core_rulebook/09-Chapter-09/chapter_9.xml</url>
<link-text>Chapter 10</link-text> 
<url>/rulebooks/_players_core_rulebook/10-Chapter-10/chapter_10.xml</url>
<link-text>Appendix</link-text> 
<url>/rulebooks/_players_core_rulebook/11-Appendix/Players_Core_Rulebook_Appendix.xml</url> 
</side_menu_div>

相关内容

最新更新