css - 将外部 css 文件链接到 XSLT 将不适用

转载作者：行者123 更新时间：2023-11-28 04:33:07

24

4

编辑后的问题:

我正在尝试将外部 CSS 文件链接到 xslt 文件。我的输出将采用 HTML 格式，我目前正在使用名为 TeamSite 的 CMS 工具来查看更改。我尝试添加一个 head 标签和一个 link 标签来添加它，就像在 html 设置中一样，但是没有应用任何样式，也没有显示任何错误消息。

<!DOCTYPE html-entities SYSTEM "http://www.interwoven.com/livesite/xsl/xsl-html.dtd">
<xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:include href="http://www.interwoven.com/livesite/xsl/HTMLTemplates.xsl"/>
<xsl:include href="http://www.interwoven.com/livesite/xsl/StringTemplates.xsl"/>


<xsl:template match="/">
    <html>
      <head>
                <link href="slick.css" rel="stylesheet" type="text/css" />
                <link href="slick-theme.css" rel="stylesheet" type="text/css" />
      </head>
    </html>
  </xsl:template>


<xsl:template match="/">
    <xsl:variable name="TILES" select="/Properties/Data/Datum[@Name='Tile']/DCR/herotile"/>
        <section class="center slider">
            <xsl:for-each select="$TILES">
                <div style="border-color:blue; border-style: solid;">
                </div>
            </xsl:for-each>
        </section>

    <script type= 'javascript'>
      <![CDATA[
      $(document).ready(function() {
        $(".center").slick({
          dots: false,
          infinite: true,
          centerMode: true,
          slidesToShow: 4,
          slidesToScroll: 4,
          centerPadding: '0'
        });
      })
      ]]>
    </script>
</xsl:template>
</xsl:stylesheet>

我也试过将整个 css 复制粘贴到 xslt 文件中，看看我的文件路径是否不正确，但还是不行。

<xsl:template match="/">
    <html>
        <head>
            <style>
                .slick-slider
                {
                    position: relative;

                    display: block;
                    box-sizing: border-box;

                    -webkit-user-select: none;
                       -moz-user-select: none;
                        -ms-user-select: none;
                            user-select: none;

                    -webkit-touch-callout: none;
                    -khtml-user-select: none;
                    -ms-touch-action: pan-y;
                        touch-action: pan-y;
                    -webkit-tap-highlight-color: transparent;
                }

                .slick-list
                {
                    position: relative;

                    display: block;
                    overflow: hidden;

                    margin: 0;
                    padding: 0;
                }
                .slick-list:focus
                {
                    outline: none;
                }
                .slick-list.dragging
                {
                    cursor: pointer;
                    cursor: hand;
                }

                .slick-slider .slick-track,
                .slick-slider .slick-list
                {
                    -webkit-transform: translate3d(0, 0, 0);
                       -moz-transform: translate3d(0, 0, 0);
                        -ms-transform: translate3d(0, 0, 0);
                         -o-transform: translate3d(0, 0, 0);
                            transform: translate3d(0, 0, 0);
                }

                .slick-track
                {
                    position: relative;
                    top: 0;
                    left: 0;

                    display: block;
                }
                .slick-track:before,
                .slick-track:after
                {
                    display: table;

                    content: '';
                }
                .slick-track:after
                {
                    clear: both;
                }
                .slick-loading .slick-track
                {
                    visibility: hidden;
                }

                .slick-slide
                {
                    display: none;
                    float: left;

                    height: 100%;
                    min-height: 1px;
                }
                [dir='rtl'] .slick-slide
                {
                    float: right;
                }
                .slick-slide img
                {
                    display: block;
                }
                .slick-slide.slick-loading img
                {
                    display: none;
                }
                .slick-slide.dragging img
                {
                    pointer-events: none;
                }
                .slick-initialized .slick-slide
                {
                    display: block;
                }
                .slick-loading .slick-slide
                {
                    visibility: hidden;
                }
                .slick-vertical .slick-slide
                {
                    display: block;

                    height: auto;

                    border: 1px solid transparent;
                }
                .slick-arrow.slick-hidden {
                    display: none;
                }
                .slider {
              width: 50%;
              margin: 100px auto;
          }
          .slick-slide {
            margin: 0px 20px;
          }
          .slick-slide img {
            width: 100%;
          }
          .slick-prev:before,
          .slick-next:before {
              color: black;
          }
            </style>
        </head>
    </html>
</xsl:template>

知道如何链接外部 css 文件吗？

最佳答案

你只能有一个匹配 / 的模板(除非你使用模式)所以你必须决定在那里放什么，一种方法是例如

<xsl:template match="/">
    <html>
      <head>
                <link href="slick.css" rel="stylesheet" type="text/css" />
                <link href="slick-theme.css" rel="stylesheet" type="text/css" />
      </head>
      <body>
        <xsl:apply-templates/>
      </body>
    </html>
</xsl:template>

然后确保为文档中的元素编写另一个模板，例如

<xsl:template match="Properties">

        <section class="center slider">
            <xsl:for-each select="Data/Datum[@Name='Tile']/DCR/herotile">
                <div style="border-color:blue; border-style: solid;">
                </div>
            </xsl:for-each>
        </section>

    <script type= 'javascript'>
      <![CDATA[
      $(document).ready(function() {
        $(".center").slick({
          dots: false,
          infinite: true,
          centerMode: true,
          slidesToShow: 4,
          slidesToScroll: 4,
          centerPadding: '0'
        });
      })
      ]]>
    </script>
</xsl:template>

或者确保您的单个模板匹配 / 创建完整的 HTML 文档，例如

<xsl:template match="/">
    <html>
      <head>
                <link href="slick.css" rel="stylesheet" type="text/css" />
                <link href="slick-theme.css" rel="stylesheet" type="text/css" />
      </head>
      <body>
        <section class="center slider">
            <xsl:for-each select="Properties/Data/Datum[@Name='Tile']/DCR/herotile">
                <div style="border-color:blue; border-style: solid;">
                </div>
            </xsl:for-each>
        </section>

    <script type= 'javascript'>
      <![CDATA[
      $(document).ready(function() {
        $(".center").slick({
          dots: false,
          infinite: true,
          centerMode: true,
          slidesToShow: 4,
          slidesToScroll: 4,
          centerPadding: '0'
        });
      })
      ]]>
    </script>
      </body>
    </html>
</xsl:template>

关于css - 将外部 css 文件链接到 XSLT 将不适用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41639168/

24

4

0

文章推荐： css - 如何使用 CSS 垂直对齐 HTML 元素

文章推荐： html - 宽度为 100% 的 div，包括边距

文章推荐： css - 只有一流的纯 CSS？

文章推荐： html - 位置符号的 HTML 实体是什么

xslt - 使用 XSLT 从 XSLT 样式表中删除命名空间声明
我有一个 XSLT 样式表，如下所示: 我想使用第二个 XSLT 样式表来转换此样式表，以删除与 XQHead
xslt - 一个大的 xslt 优于更小、更细粒度的 xslt
我们有一个大型 xslt，可以呈现整个商店区域，包括产品、制造商，并根据价格和类别进行过滤。我使用 sitecore 作为 CMS，但遇到缓存问题。我有大约 9000 个项目，有些页面需要长达 20
xslt - XSLT:是否应用带有条件参数的模板？
我想根据条件的结果应用具有不同参数的模板。像这样： Attribute no. 1
xslt - 循环 XSLT
我有一些看起来像这样的 XML Foo Details Bar Details Baz Details Foo Blah Bar BlahBlah Baz BlahBlahBl
xslt - XSLT 中的矩阵转置
我试图从这种输入出发: a b c d e f g ... 使用 XSLT 的 HTML 输出: one two a e b f
xslt - xslt 中的第一个子节点名称
我想知道如何在 xslt 中找到特定节点的第一个子节点名称。我有一个 xml: some text 我可以使用 body/
xslt - XSLT 中上个月的最后一天
是否可以在 XSLT 中获取上个月的最后一天？我找到了这个函数:http://www.xsltfunctions.com/xsl/functx_last-day-of-month.html但我不确定如
xslt - xslt 中匹配命名空间的问题
具有特定节点的匹配元素存在问题。 xml: description of profile PhoneKeyPad S
xslt - XSLT 中的动态变量
我将一堆键值对作为参数传递给 XSL(日期 ->“1 月 20 日”，作者 ->“Dominic Rodger”，...)。我正在解析的一些 XML 中引用了这些 - XML 如下所示: 目前，除
xslt - xslt 中最后一个字符后的子字符串
我找不到这个问题的确切答案，所以我希望有人能在这里帮助我。我有一个字符串，我想在最后一个 '.' 之后获取子字符串。我正在使用 xslt 1.0。这是怎么做的？这是我的代码。
xslt - XSLT 中的变量范围
我在尝试找出 xslt 上的 var 范围时遇到问题。我实际上想要做的是忽略具有重复“旅游代码”的“旅行”标签。示例 XML: X1 Budapest X1 Budapest X
xslt - XSLT 中的动态排序？
我有一些数据在 xslt 的 for-each 循环中输出。我对列表进行了分页，但没有对排序选择器进行分页。用户应该能够对 2 个值(创建的数据和每个项目的数字字段)进行排序。默认的排序方法是创建日
xslt - XSLT 的奇怪排序要求
我有一个奇怪的要求。我在 xslt 中有一个包含月份的变量，带有它们的 id (1-12) 问题是我需要全部显示它们，但从一月(1)以外的月份开始。目前我有以下 JAN
xslt - 模块化 xslt？
如何在 xslt 转换中模块化一组重复的输出？例如，我有如下内容(伪代码)。并
xslt - XSLT 中的位置字符串拆分
我得到一个像这样的字符串。 13091711111100222222003333330044444400 字符串的模式是这样的 13 - 09 - 17 - 11111 - 100 - 22222 -
xslt - XSLT 中的设计和编码模式
我是 XSLT 的新手，有一个一般性问题。为了区分具有不同属性的两个元素，最好(也是为了性能)使用和而不是在一个模板中。据我所知，这就是 XSLT 中应该“思考”的方式。但在我看来，这有一个缺点
xslt - 如何从字符串中删除连字符 +xslt
如何从“19650512-0065”到“196505120065”这样的字符串中删除连字符使用这个模板:传递 theID =
xslt - XSLT 中的填充零
是否有任何功能可以在左侧填充零？我正在尝试做的要求是: 我们不知道即将到来的输入字符串长度。如果小于 20，我们必须在左侧填充零。如果输入字符串长度为 10，那么我们必须在左侧填充 10 个零。
xslt - XSLT 应用模板的默认选择是什么？
身份模板如下所示: 是否选择多于，或者身份模板可能是这样的？当我执行以下操作时，究竟选择了什么？最佳答案
xslt - XSLT 模板中的超链接
我正在尝试使用 XML 信息和 XSLT 模板创建超链接。这是 XML 源代码。 Among individual stocks, the top percentage gainers in the

首页

博学

6Ren·AI

商城

css - 将外部 css 文件链接到 XSLT 将不适用

编辑后的问题: