1. 程式人生 > >jsf中匯入css檔案

jsf中匯入css檔案

最近在用JSF做一個專案,可是專案中很多的JSF標籤讓人摸不著頭腦,並且標籤裡面那很多的屬性也是真的夠折騰人的。雖然JSF或者PrimeFaces有相應的很多官方文件可以查,但是僅僅就那麼一點的描述真的還不能讓人很快的上手,只有我們自己去做,去實踐一下,才能真真的體驗相應標籤的用處。這樣的話,在遇到jsf問題或bug 的時候改起來也比較快速。
近日,在css標籤的練習過程中,想匯入相對路徑下的css樣式檔案,可是一直都不能匯入成功。網路上查到的匯入css等資源的時候寫法也是如下:

Html程式碼 
  1. <h:outputStylesheet library="css"  name="../resources/styles.css"
      />  

 但是別人的都能成功,為什麼自己的一直匯入不成功。很是鬱悶。 以為是相對路徑的問題,把路徑改成

Html程式碼 
  1. <h:outputStylesheet library="css"  name="resources/styles.css"  />  
  2. <h:outputStylesheet library="css"  name="/resources/styles.css"  />  

 得到的結果都是:

Html程式碼 
  1. <link type="text/css" rel="stylesheet" href="RES_NOT_FOUND"
     />  

 NoT_FounD是個痛苦的結果。
網上找的很多的結果也就是說是可能是相對路徑的問題。可是都試過了,為什麼還是不行呢。
於是http://www.mkyong.com/jsf2/resources-library-in-jsf-2-0/ 就有了我想要的結果。
原來library是指定到那個目錄下的檔案。而不是說指明瞭檔案的樣式。
原先我的目錄結構是:


看了MKYoung的文章之後,發現根本不用什麼resources來指定,只要檔案目錄層次是對的,那麼直接跟上名字就可以了。
設定資料夾目錄:


修改程式碼

Html程式碼 
  1. <h:outputStylesheet library
    ="css"  name="styles.css"  />  

 檢視output的結果如下:

Html程式碼 
  1. <link type="text/css" rel="stylesheet" href="/helloworld/javax.faces.resource/styles.css.xhtml?ln=css" />  

 
 哈哈,成功了。
JSF 中所有的資原始檔都是自己特定的目錄層次,只要按照規範來的話,寫法還有其他的好幾種.