Question

我正在从XML文件构建菜单列表，XML文件用于构建水平和垂直菜单列表。列表的样式[水平/垂直]取决于内容的放置位置。

我能够通过JavaScript和CSS成功完成此操作。如果禁用JavaScript，我还会通过在对象标记中嵌入XML文件来提供后备。 XML文件附加了一张XSL表来处理格式化。

我遇到的问题是我无法像使用JavaScript那样设置列表样式。我不确定我是否以正确的方式实现这一点，但如果有方法可以让我知道。

CSS

#horMenu ul li{//rules to display it horizontally}
#verMenu ul li{//rules to display it vertically}

HTML

    <div id=horMenu>
    //build a ul list using js,append it and the menu is diplayed horizontally

    <noscript>
     <div> 
      <object data="menu/menu.xml" type="all"></object>
     </div> 
    </noscript>

    </div>

    <div id=verMenu>
    //build a ul list using js,append it and the menu is diplayed vertically

   <noscript>
    <div> 
      <object data="menu/menu.xml" type="all"></object>
     </div> 
    </noscript>

    </div>

XML

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="menu.xsl"?>
<menuList>
    <menu loc="menu1.htm">menu 1</menu>
    <menu loc="menu2.htm">menu 2</menu> 
    <menu loc="menu3.htm">menu 3</menu> 
    <menu loc="menu4.htm">menu 4</menu> 
    <menu loc="menu5.htm">menu 5</menu> 
</menuList>

XSL

<?xml version="1.0" ?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    <xsl:template match="/">
        <html>
            <head>
                <link href="../css/Style.css" rel="stylesheet" type="text/css" />   
            </head>
            <body>
                <ul>
                    <xsl:for-each select="menuList/menu">
                        <li>
                            <a>
                                <xsl:attribute name="href">
                                    <xsl:value-of select="@loc"/>
                                </xsl:attribute>
                                <xsl:value-of select="."/>
                            </a>
                        </li>
                    </xsl:for-each>
                </ul>
            </body>
        </html>
    </xsl:template>
</xsl:stylesheet>

我能够将使用JavaScript构建的UL列表附加到DIVs horMenu和verMenu。根据我在horMenu和verMenu中获得的UL规则，UL列表分别水平和垂直显示。当我使用oject标签嵌入XML文件时，它无法将相同的CSS应用于XSLT中的UL。 DESIRED RESULT

根据内容放置在HTML页面中的位置设置XML数据样式

0 个答案: