我用样式表构建JSF页面。当我在Eclipse中使用预览功能时,它们似乎可以工作,但是一旦我在IE8上对其进行测试,它们似乎就没有任何作用。

我使用复合视图以指定页面的总体布局,如下所示。

<!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:ui="http://java.sun.com/jsf/facelets">
    <head>
        <link rel="stylesheet" type="text/css" href="/css/masterTemplateCSS/masterTemplateCSS.css" />


        <title><ui:insert name="title"></ui:insert></title>
    </head>

    <body>

        <div class="left_Sidebar">
            <ui:insert name="leftSidebar">

            </ui:insert>
        </div>

        <div class="bulk_text">
            <ui:insert name="content">

            </ui:insert>
        </div>

        <div class="foot">
            <ui:insert name="footer">

            </ui:insert>
        </div>

    </body>
</html>


然后,我尝试对其进行测试。

<ui:composition template="/templates/masterTemplate.xhtml">

    <ui:define name="title">Create Screen</ui:define>

    <ui:define name="leftSidebar">
        Left sidebar
    </ui:define>
    <ui:define name="content">


模板可以工作,我相信CSS路径是正确的。我还使用验证器测试了css文件,它们都已签出。但它似乎仍然可以在实际的浏览器中运行:S

最佳答案

您需要学习相对URL的工作方式。 CSS文件的相对URL

<link rel="stylesheet" type="text/css" href="/css/masterTemplateCSS/masterTemplateCSS.css" />


以斜杠开头,因此它是相对于域根的,并且URL实际上指向http://localhost:8080/css/masterTemplateCSS/masterTemplateCSS.css

如果您的Web应用程序不是部署在上下文根目录上,而是部署在子上下文路径(例如http://localhost:8080/contextname)上,则显然这是行不通的。 CSS文件应指向http://localhost:8080/contextname/css/masterTemplateCSS/masterTemplateCSS.css

替换为

<link rel="stylesheet" type="text/css" href="#{request.contextPath}/css/masterTemplateCSS/masterTemplateCSS.css" />


这样,它将以/contextname/css/masterTemplateCSS/masterTemplateCSS.css结尾,并指向正确的绝对URL。

如注释中所述,请勿将其替换为磁盘文件系统路径。当网页必须通过互联网提供时,这根本无法工作。您将来的Web访问者当然不会在自己的本地磁盘文件系统上拥有您的CSS文件。

10-08 20:19