Fatal编程技术网
  • css/
  • CSS在浏览器上不起作用，但在Eclipse上起作用

CSS在浏览器上不起作用，但在Eclipse上起作用

css jsf

CSS在浏览器上不起作用，但在Eclipse上起作用,css,jsf,facelets,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 xmln

我正在用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>
然后我试着测试它们

<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文件，它们都已签出。但它在实际浏览器中似乎仍然不起作用：您需要了解相对URL是如何工作的。CSS文件的相对URL

<link rel="stylesheet" type="text/css" href="/css/masterTemplateCSS/masterTemplateCSS.css" />
以前导斜杠开始，因此它相对于域根，URL实际上指向

如果您的Web应用程序不是部署在上下文根目录上，而是部署在子上下文路径上，那么这显然是行不通的，例如。CSS文件应该指向

将链接替换为

<link rel="stylesheet" type="text/css" href="#{request.contextPath}/css/masterTemplateCSS/masterTemplateCSS.css" />
这样，它将以
/contextname/css/masterTemplateCSS/masterTemplateCSS.css结尾，从而指向正确的绝对URL


不要像您在评论中提到的那样用磁盘文件系统路径替换它。当网页在互联网上提供服务时，这根本不起作用。您未来的web访问者肯定不会在他们自己的本地磁盘文件系统中拥有您的CSS文件。
您需要了解相对URL是如何工作的。CSS文件的相对URL


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






以前导斜杠开始，因此它相对于域根，URL实际上指向

如果您的Web应用程序不是部署在上下文根目录上，而是部署在子上下文路径上，那么这显然是行不通的，例如。CSS文件应该指向

将链接替换为


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






这样，它将以
/contextname/css/masterTemplateCSS/masterTemplateCSS.css结尾，从而指向正确的绝对URL


不要像您在评论中提到的那样用磁盘文件系统路径替换它。当网页在互联网上提供服务时，这根本不起作用。您未来的web访问者肯定不会在他们自己的本地磁盘文件系统中使用您的CSS文件。
它在任何其他浏览器（如Firefox）中都可以使用吗？当您使用view:source时，样式表会显示吗？在浏览器中复制并粘贴该url时会发生什么情况？它在其他浏览器中工作吗？我发现了问题，不幸的是它没有意义。。。通过定义css文件“C:\\…\css.css”的绝对路径，它似乎可以工作，尽管我不明白为什么给定的路径在我检查路径名时不能工作。无论如何，谢谢你的快速回复！它在其他浏览器（如Firefox）中工作吗？在执行view:source时是否会显示样式表？在浏览器中复制并粘贴该url时会发生什么情况？它在其他浏览器中工作吗？我发现了问题，不幸的是它没有意义。。。通过定义css文件“C:\\…\css.css”的绝对路径，它似乎可以工作，尽管我不明白为什么给定的路径在我检查路径名时不能工作。无论如何，谢谢你的快速回复！