我在使用JSF2.0时遇到了同样的问题，我不得不使用CSS，相对路径的解决方案也不适合我（就像Choghere发布的那样）。
在我的书中我读到当你使用Facelets作为VDL（视图声明语言）时，即使在一个普通的HTML页面中也可以使用表达式.所以我有了直接在CSS中放置EL的想法.我没有改变文件名或任何东西。
下面是我所做的。但首先我的文件结构：

• /resources/common/overlay.xhtml -〉这一个包含了下面的css（它是一个复合组件）
• /resources/common/overlay.css
• /resources/images/logo.png

接下来是CSS：

.someclass { 
    background-image:url("#{resource['images:logo.png']}"); 
}

在本例中，resource 是JSF 2的一个隐式对象，images 是JSF应该查找的库（jsf期望资源下的所有库/文件，至少是默认的ResourceHandler），然后是资源的名称。
对于更深层次的结构，它将是：

#{resource['images/folder:logo.png']}

假设有问题的元素应用了一个class="rich-ddmenu-label"，那么问题很可能是背景图像的路径。
路径是相对于CSS所在的位置。如果它在外部文件中，则应该是相对于该文件的路径，例如：

/css/styles.css
/images/the_image.gif

CSS应该：

background-image: url("../images/the_image.gif");

如果CSS内嵌在HTML页面上，它将相对于当前路径，因此如果页面位于http://server/path/to/page，它将在http://server/path/to/page/images/the_image.gif查找图像，而您可能指的是http://server/images/the_image.gif。
如果这没有回答它，请张贴生成的HTML。

你是否遵循了Richfaces demo site上的例子？即，使用一个facet并将图像和文本放置在一个封闭的元素（例如，span或div）内

<rich:dropDownMenu>
    <f:facet name="label"> 
        <h:panelGroup>
            <h:graphicImage value="/images/icons/copy.gif" styleClass="pic"/>
            <h:outputText value="File"/>
        </h:panelGroup>
    </f:facet>
    <rich:menuItem submitMode="ajax" value="New"
        action="#{ddmenu.doNew}" icon="/images/icons/create_doc.gif">
    </rich:menuItem>
    ...
</rich:dropDownMenu>

我的文件夹结构如下：
网页-〉资源-〉css//css页面
网页-〉资源-〉图片//图像
网页//xhtml文件
尝试以下方法：

background-image :url("../pics/logo.gif");

..向上移动一个文件夹级别/pics将您移动到pics目录/logo.gif提供文件
希望这个有用。

我得到了这个解决方案：创建一个新的.css文件与此内容

body {
background-image: url(../resources/images/Fondo.GIF);
}

这将以和html相同的方式加载文件。2有了这个，你将能够在body层加载一个背景文件（在整个页面上）。3之后你可以在jsf文件中用这个指令加载css文件：

<h:head>
    <h:outputStylesheet name="ps-pagolinea.css" library="css" />
    <h:outputScript name="corrigePoliza.js" library="scripts"/>
</h:head>