0

我在这里遵循了每个示例

但似乎没有任何效果。

我尝试将图像添加到我的命令按钮但是..

.imagesbuton{
    background-image:url("/image/add.jpg") !important ;
    width: 30;  
    height: 40;}


<p:commandButton  image="imagesbuton" rendered="#{LigneXL.resultat eq 'N existe pas'}"   action="#{composantbean.initialise()}" />
4

1 回答 1

1

好的，<style>声明元素的页面的完整 URL 如下：

http://localhost:8080/JEE/pages/Menu.jsf

并且您没有明确指定您要使用的图像文件的完整 URL <style>，但这很可能基于迄今为止提供的信息：

http://localhost:8080/JEE/image/add.jpg

您的具体问题很可能是由于您以某种方式期望是服务器根据服务器的项目结构将图像内联到 HTML 文档中。然而这是完全错误的。相反，网络浏览器相对于引用图像资源的主要资源的 URL（可以是 CSS 文件，或者在您的情况下是 JSF 页面本身）分别下载图像，并将其包含在呈现的 HTML 表示中。

因此，当您使用url("/image/add.jpg")前导斜杠指定时，这将使其成为域相对 URL，然后浏览器将尝试从以下位置下载图像：

http://localhost:8080/image/add.jpg

然而，这是错误的。如果您在浏览器的开发者工具集中关注了 HTTP 流量，那么您应该已经注意到浏览器在图像请求中检索到了 HTTP 404 错误。如果需要指定域相关 URL，则需要包含上下文路径。您可以静态地做到这一点：

.imagesbuton {
    background-image: url("/JEE/image/add.jpg");
}

或动态：

.imagesbuton {
    background-image: url("#{request.contextPath}/image/add.jpg");
}

或者，您可以使用相对 URL，将一个文件夹从一个文件夹上/JEE/pages移到该文件夹/JEE​​，然后再到该/image文件夹​​：

.imagesbuton {
    background-image: url("../image/add.jpg");
}
于 2013-05-24T14:20:45.597 回答