订购 <h:outputStyleSheet> 和 <link rel="stylesheet"> 交换答案

【问题标题】：Ordering <h:outputStyleSheet> and <link rel="stylesheet"> swapped订购 <h:outputStyleSheet> 和 <link rel="stylesheet"> 交换
【发布时间】：2014-10-02 22:23:09
【问题描述】：

在我的 JSF 2.2 Facelet 中，我有以下代码：

<html  ... >
  <f:view>
    <h:head>  
       <h:outputStylesheet name="bootstrap-lib/css/bootstrap.css" />
       <h:outputStylesheet library="jquery-ui" name="css/jquery-ui.css" />
       <link rel="stylesheet" type="text/css" href="url.to.css" />
      ...
    </h:head>
    ...
  </f:view>
</html>

然而，这会输出：

<html ...>
  <head>
    ...
    <link rel="stylesheet" type="text/css" href="url.to.css" />
    <link type="text/css" rel="stylesheet" href=".../javax.faces.resource/bootstrap-lib/css/bootstrap.css.xhtml?con=bootstrap" />
    <link type="text/css" rel="stylesheet" href=".../javax.faces.resource/css/jquery-ui.css.xhtml?ln=jquery-ui&amp;con=bootstrap" />
    ...
  </head>
  ...
</html>

link 和 outputStylesheet 中定义的样式表的排序被忽略，“outputStyleSheet”样式表总是放在最后。

我需要使用“链接”标签定义的“url.to.css”样式表作为列表中的最后一个，因此它将占主导地位。我怎样才能解决这个问题？

【问题讨论】：

标签： jsf facelets jsf-2.2 stylesheet-link-tag

【解决方案1】：

用@import修复：

小脸：

<html ...>
  <head>
    ...
     <h:outputStylesheet name="css/all.css" />
    ...
  </head>
  ...
</html>

all.css

@import url("#{resource['bootstrap-lib/css/bootstrap.css']}");
@import url("#{resource['jquery-ui:css/jquery-ui.css']}");
@import url("url.to.css");

【讨论】：

我正在通过 CDN 检索我的 bootstrap.css。相应的链接标签如下所示：<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"/>。使用@import时有没有办法包括完整性验证？