控制XPage的順序使用移動主題的CSS

當使用XPages Mobile主題時，我添加到頁面的CSS文件是在IBM作爲移動主題的一部分提供的CSS文件之前添加的資源。控制XPage的順序使用移動主題的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被列在鏈中的第一個時，控制風格更具挑戰性（但並非不可能）。

來源

2013-09-23 Peter Presnell

你能告訴你如何將它們包含在XPage中嗎？我認爲他們被列入的資源？ –

我找到了解決辦法。我不確定它是否符合W3規範，但我可以簡單地將它作爲XML代碼放入XPage中，將鏈接添加到Body中。

<link rel="stylesheet" type="text/css" href="/redpill/graph.nsf/mobile.css"></link>

來源

2013-09-23 16:03:28

此答案假定使用移動工具不會改變對象的加載方式。

我使用一個主題，我的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文件，我做了以下內容：

Select Mobile Theme

創建新頁面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-23 13:13:18

你可以證明，當一個移動主題已被應用。我的經驗是，當一個移動主題被提名時，它會忽略應用程序的主題設置。 –

嗯。實際上，我只是用移動主題進行了測試（創建一個新的m_ XPage，並且我將styleSheet作爲一個資源包含在其中，並且它仍然出現在生成的文件之後，您使用的是什麼版本的Designer？ –

這很令人費解。實際上沒有看到IBM提供的任何移動CSS文件來支持移動設備，我期望看到customMobile.css和另外兩個用於Android或iPhone的CSS，它讓我的自定義CSS出現在挑戰之後我正在爲Designer和Domino運行9.0. –

控制XPage的順序使用移動主題的CSS

回答

相關問題