将条件 css 样式表添加到 xpage

Question

是否可以将条件样式表添加到 xpage。

在 html 中这样做：

<!--[if lt IE 8]><link rel="stylesheet" href="../../blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->

虽然关于添加计算字段设置为 HTML 和代码 javascript，如：

return '<!--[if lt IE 8]><link rel=\"stylesheet\" href=\"../../blueprint/ie.css\" type=\"text/css\" media=\"screen, projection\"><![endif]-->'

但它会包含在页面的正文中，而不是包含在其他样式表的标题中。

需要使用 http://blueprintcss.org 进行概念验证。

Answer 1

Xpage 主题非常适合。 notes 安装中包含一个示例。

转到 C:\ Notes 目录 \xsp\nsf\themes

复制 webStandard.theme，重命名为 webStandard.xml 并在您选择的编辑器中打开，这将向您展示主题可以做什么的许多示例。应用属性、添加资源、通过表达式等计算这些。

片段：

    <resource rendered="#{javascript:context.isDirectionRTL()}">
        <content-type>text/css</content-type>
        <href>/.ibmxspres/global/theme/webstandard/xspRTL.css</href>
    </resource>

    <!-- IE Specific -->
    <resource rendered="#{javascript:context.getUserAgent().isIE(0,6)}">
        <content-type>text/css</content-type>
        <href>/.ibmxspres/global/theme/webstandard/xspIE06.css</href>
    </resource>
    <resource rendered="#{javascript:context.getUserAgent().isIE(7,8)}">
        <content-type>text/css</content-type>
        <href>/.ibmxspres/global/theme/webstandard/xspIE78.css</href>
    </resource>

Answer 2

您可以使用带有 SSJS 的 rendered 属性来显示仅适用于 IE 的元素：

rendered="#{javascript:context.getUserAgent().isIE()}"

只有在使用 Internet Explorer 打开 XPage 时，您的 CSS 资源才会添加到生成的 HTML 响应中。

编辑：
在您的情况下，这应该符合您的要求：

<xp:this.resources>
   <xp:styleSheet href="../../blueprint/ie.css"
      rendered="#{javascript:context.getUserAgent().isIE(0,7)}"
      media="screen, projection">
   </xp:styleSheet>
</xp:this.resources>