CSS不适用于浏览器,但它适用于Eclipse

Dav*_*vid 0 css jsf facelets

我用styesheets构建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>
Run Code Online (Sandbox Code Playgroud)

然后我尝试测试它们.

<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">
Run Code Online (Sandbox Code Playgroud)

模板有效,我相信css路径是正确的.我还用验证器测试了css文件,他们都检查了.但它仍然似乎在实际的浏览器中工作:S

Bal*_*usC 5

您需要了解相对URL的工作原理.CSS文件的相对URL

<link rel="stylesheet" type="text/css" href="/css/masterTemplateCSS/masterTemplateCSS.css" />
Run Code Online (Sandbox Code Playgroud)

以前导斜杠开头,因此它相对于域根,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" />
Run Code Online (Sandbox Code Playgroud)

这样它最终会成为/contextname/css/masterTemplateCSS/masterTemplateCSS.css正确的绝对URL.

难道不是由磁盘文件系统路径为您在留言中提到替换它.当网页通过互联网提供时,这根本不起作用.您未来的Web访问者肯定没有将CSS文件放在他们自己的本地磁盘文件系统中.