1

我有一个 JSF facelet，它有一个我想使用 CSS 设置样式的文本字符串。它位于 h1 标签中：

<h1 align="center">Welcome Back</h1>

我的问题是，首先，CSS 文件将放在 JSF 应用程序的目录结构中的什么位置，第二，如何将 CSS 样式添加到文本中？

谢谢！

4

1 回答 1

2

我有一个 JSF facelet，它有一个我想使用 CSS 设置样式的文本字符串。它位于 h1 标签中：
<h1 align="center">Welcome Back</h1>

这是个好主意。该align属性是无效的HTML5。CSS 放在style属性中，或者更好的是，放在它自己的.css文件中。您应该努力使您的 JSF/HTML 代码没有style属性（因此所有样式都在.css文件中）。

我的问题是，首先，CSS 文件在 JSF 应用程序的目录结构中的位置

所有 JSF 资源都应放在该/resources文件夹中（如有必要，进一步划分为子文件夹）。这是一个相当基本的例子：

WebContent
 |-- META-INF
 |-- WEB-INF
 |    |-- template.xhtml
 |    |-- faces-config.xml
 |    `-- web.xml
 |-- resources
 |    |-- image.png
 |    |-- script.js
 |    `-- style.css
 `-- index.xhtml

<h:head>您需要在主模板中按如下方式引用它。

<h:outputStylesheet name="style.css" />

（等价于 JS 和图片的 and <h:outputScript>）<h:graphicImage>

第二，如何将 CSS 样式添加到文本中？

只需通过 中的以下条目style.css，前提是您的网站的设计方式是在主布局模板中只有一个 <h1>在整个网站中都是相同的。

h1 {
    text-align: center;
}

否则，您需要给它一个idor class。在为 JSF 编写 CSS 时，请记住 CSS 仅适用于客户端的 JSF 生成的 HTML 输出，而不适用于服务器端的 JSF 源代码。因此，如果对 HTML 输出有疑问，请在 webbrowser 中打开 JSF 页面并查看源代码（或使用 webbrowser 的开发人员工具集进行树检查）。

也可以看看：

于 2012-12-12T01:23:37.593 回答