我可以使用EL將外部CSS文件與JSF一起使用嗎？

在我目前的JSF項目的外部樣式表，也有硬編碼鏈接到外部資源，如我可以使用EL將外部CSS文件與JSF一起使用嗎？

.someId { background-image:url(/context/resources/images/example.jpg); }

在JSF XHTML文檔，我可以用EL表達式如$ {} request.contextPath但如何才能EL處理應用於CSS文件？

的上下文路徑硬編碼有一個缺點：上下文路徑 - /context在示例 - 一個web應用可以在部署時通過修改網絡而改變。 xml（或者如果web.xml中沒有指定上下文，則通過重命名Web應用程序存檔文件），但是CSS文件中資源的鏈接仍然會指向未更改的硬編碼上下文，並導致找不到資源錯誤。

來源

2011-05-01 mjn

我把CSS圖像總是放在CSS文件夾的子文件夾中。例如。

/resources/css/style.css
/資源/ CSS /圖像/例子。JPG

這樣你只落得像

.someId { background-image:url(images/example.jpg); }

是的，他們都解決了相對的CSS文件本身的URL，而不是主要的JSF/HTML頁面。

來源

2011-05-16 11:10:03 BalusC

BalusC，我知道這個評論沒有添加任何有用的反饋，但我只是不得不說。你是個天才。 – arg20 2012-02-21 18:57:39

@ arg20：謝謝:)相關問題btw：http://stackoverflow.com/questions/6835499/changing-jsf-prefix-to-suffix-mapping-forces-me-to-reapply-the-mapping-on- CSS-BA/6835701＃6835701 – BalusC 2012-02-21 19:00:36

不，你不能。您有幾種選擇：

硬編碼的絕對路徑（相對域，當然） - 並不壞
使用相對路徑 - 可當你嵌套的URL像/view/external/foo/bar.jsf
預處理他們一個問題在構建期間設置適當的路徑
使用Filter（以及客戶端和服務器端緩存）來設置正確的路徑。

（我覺得我失去了一些東西）

來源

2011-05-01 09:04:01 Bozho

自定義資源處理程序如何？ – tasel 2011-05-01 20:35:40

好點。添加此作爲答案的細節。 – Bozho 2011-05-01 21:02:41

請看我今天發佈的答案。它插在頂部，這對我來說有點困惑o_O – tasel 2011-05-16 10:59:28

@ Bozho的回答幾乎涵蓋你的選擇。

另一種可能性是繼續對具有靜態樣式表，並在文檔的頭動態部分，在那裏你可以訪問你的表情填充：在PHP世界

<head> 

<!-- The style sheet contains 99% of the CSS -> 
<link rel="stylesheet" href="static.css" type="text/css"> 

<!-- The remaining 1% is done here --> 
<style type="text/css"> 
.someClass { --- your dynamic values here --- } 
</style> 

</head>

，這是最好的做法因爲它爲樣式表調用節省了昂貴的PHP過程。我不知道JSP世界中的情況如何，但我認爲它是相似的。

來源

2011-05-01 09:06:03

@Bozho： JSF允許定義一個ResourceHandler來替換標準的。您可以繼承javax.faces.application.ResourceHandler，處理特定的請求並將其他人委託給基類。

對於給定示例，自定義資源處理程序應確定上下文並替換絕對路徑定義。這可以在每個請求的基礎上啓用動態路徑解析。

來源

2011-05-16 10:56:39 tasel

也許我誤解你的問題，但如果通過外部CSS，你只是說自己的CSS不是直列，然後用JSF 2.0，你可以在你的CSS，只要你包括它與<h:outputStylesheet>使用EL。例如，我有一個項目，這樣的結構：

war 
|__ WEB-INF 
| |__ *standardStuff* 
|__ resources 
| |__ css 
| | |__ style.css 
| |__ images 
|  |__ image1.png 
|__ xhtml 
| |__ index.xhtml

這顯然是不完整的文件列表，但應該足以獲得分數。然後，我有這個在我的index.xhtml：

<f:view xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:ui="http://java.sun.com/jsf/facelets"> 
    <h:head/> 
    <h:body> 
    <h:outputStylesheet library="css" name="style.css" target="head"/> 
    <ui:include src="content.xhtml"/> 
    </h:body> 
</f:view>

而且在我的CSS我有這樣的事情：

.someClass { 
    background-image: url('#{resource['images/image1.png']}'); 
}

來源

2011-07-19 20:29:14 Lucas

您可以沿着使用表達式語言（EL）與FacesContext解決問題。我經常使用這種技術。

background-image: url('#{facesContext.externalContext.requestContextPath}/resources/images/background.gif');

這允許您利用JSF根據應用程序輸入或更改提供動態內容。

此技術適用於JSF 1.2和JSF 2.0

來源

2011-08-09 13:33:24