Question

我的问题类似于here

给出的问题

我正在尝试将背景图片添加到<table>

内的<p:panel>组件

我尝试了很多解决方案，包括下面给出的但是没有运气。背景图片没有应用在表格中。

table {
    width: 300px;
    background-image: url('mypic.png');
    background-repeat: no-repeat;
    background-position: center top;
}

在我的工作区中，我尝试在后台提供的图像位于
下的 C：\工作空间\项目\的WebContent \资源\图像\ mylogo.jpg
请告诉我如何将背景图片添加到XHTML文件中<table>内的<p:panel>。

提前致谢。

Answer 1

在纯CSS中，

如果您声明：

background-image: url('mypic.png');

您的图片必须与您的CSS文件相关。它只能在CSS文件和图像位于同一文件夹中时才能工作。

在JSF2中，

为方便起见，CSS和资源由JSF层处理。资源必须放在“WebContent / resources”文件夹中，并使用EL访问：

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

Answer 2

我通过将以下属性添加到<table>标记

来解决了上述问题

<table width="100%" height="420px" style="border: double 3px gray; margin-top: 5px;background-image: url('../resources/images/logo.jpg');background-repeat: no- repeat;">

JSF-标记不应用backgroundimage <table> </table>

2 个答案: