在 jsf 中包含 Css

Question

这是我的项目结构：

我要将 css 文件添加到 HeaderTester.xhtml 文件中：

这是HeaderTester.xhtml:

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html">
    <h:head>
        <title>Here is header</title>
        <link rel="stylesheet" type="text/css" href="headerStyle.css"/>
    </h:head>
    <h:body>
        This is Header tester class
        <div id="header">
            <h3>Sajjad HTlo</h3>
        </div>
    </h:body>
</html>

Css 文件：

*{
    margin: 0;
    padding: 0;
}

#header{
    background-color: gray;
    width: 100%;
    height: 60px;
}

h1{
    color: silver;
}

但结果只显示文本！

Answer 1

关于您的 XML namespaces 声明，您使用的是 JSF 2.2。

从 JSF 2.0 开始，您可以将 CSS、JavaScript 文件和图像（以及其他文件）放入您的根目录中的 resources 目录中网络应用程序。

然后，您可以使用 h:outputStylesheet 包含您的 CSS :

<h:outputStylesheet library="css" name="styles.css"/>

在 jsf 中包含 Css

Including Css in jsf

html

css

jsf