1

当使用 XPages Mobile 主题时，我作为资源添加到页面的 CSS 文件是在 IBM 提供的作为移动主题的一部分的 CSS 文件之前添加的。

例子：

<xp:this.resources>
  <xp:styleSheet href="css/font-awesome/css/font-awesome.css"></xp:styleSheet>
  <xp:styleSheet href="/mobile.css"></xp:styleSheet>
</xp:this.resources>

生成以下 HTML

<link rel="stylesheet" type="text/css" href="/redpill/graph.nsf/css/font-awesome/css/font-awesome.css">
<link rel="stylesheet" type="text/css" href="/redpill/graph.nsf/mobile.css">
<link rel="stylesheet" type="text/css" href="/xsp/.ibmxspres/dojoroot-1.8.1/dojox/mobile/themes/iphone/iphone.css">
<link rel="stylesheet" type="text/css" href="/xsp/.ibmxspres/.extlib/css/customMobile.css">
<link rel="stylesheet" type="text/css" href="/xsp/.ibmxspres/.extlib/css/customIphone.css">

有没有办法强制在 IBM 之后添加我自己的自定义控件？当我自己的 CSS 在链中排在首位时，控制样式更具挑战性（但并非不可能）。

4

2 回答 2

1

此答案假定使用移动工具不会改变加载对象的方式。

我使用一个主题，我的 CSS 文件出现在生成的 CSS 文件之后。

<theme extends="webstandard">
    <resource>
        <content-type>text/css</content-type>
        <href>crmStyle.css</href>
    </resource>
</theme>

使用主题在页面上生成以下内容：

<link rel="stylesheet" type="text/css" href="/xsp/.ibmxspres/dojoroot-1.8.1/dijit/themes/tundra/tundra.css">
<link rel="stylesheet" type="text/css" href="/xsp/.ibmxspres/dojoroot-1.8.1/ibm/domino/widget/layout/css/domino-default.css">
<link rel="stylesheet" type="text/css" href="/domjava/xsp/theme/webstandard/xsp.css">
<link rel="stylesheet" type="text/css" href="/domjava/xsp/theme/webstandard/xspLTR.css">
<link rel="stylesheet" type="text/css" href="/domjava/xsp/theme/webstandard/xspSF.css">
<link rel="stylesheet" type="text/css" href="/Path/crmStyle.css">

为了测试带有移动主题的 CSS 文件，我执行了以下操作：

选择移动主题

创建了新页面 m_Landing。添加 CSS 文件作为资源。

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xe="http://www.ibm.com/xsp/coreex" xmlns:xc="http://www.ibm.com/xsp/custom" themeId="MyTheme">
    <xp:this.resources>
        <xp:styleSheet href="/crmStyle.css"></xp:styleSheet>
    </xp:this.resources>
</xp:view>

生成的 HTML：

<head>
<title></title>
<script type="text/javascript" src="/xsp/.ibmxspres/dojoroot-1.8.1/dojo/dojo.js" djConfig="locale: 'en-us'"></script>
<script type="text/javascript" src="/xsp/.ibmxspres/dojoroot-1.8.1/ibm/xsp/widget/layout/layers/xspClientDojo.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="stylesheet" type="text/css" href="/Path/crmStyle.css">
</head>
于 2013-09-23T13:13:18.207 回答
1

我找到了解决方案。我不确定它是否符合 W3 规范，但我可以通过将其作为 XML 代码放置在 XPage 中来简单地将链接添加到正文中。

<link rel="stylesheet" type="text/css" href="/redpill/graph.nsf/mobile.css"></link>
于 2013-09-23T16:03:28.040 回答