html - HTML ヘッダーで背景画像を使用する

Question

panelGrid の上に画像をヘッダーとして表示する必要があるという要件があります。これが可能かどうか知りたかっただけです。現在、styeClass を使用していますが、ヘッダー イメージが panelGrid に正しく配置されていません。

<h:panelGrid columns="1" style="width: 320pt;margin: 0 auto;padding-bottom:10pt;padding-left:10pt;" styleClass="fooheader" >

使用されているスタイル:

.fooheader {
background: url(../img/foo.png) no-repeat;
width: 395px;
height: 73px;
}

foo.png の寸法: 395 X 68

以下の HTML 生成コンテンツを見つけてください。

                                <tbody>
            <tr>
            <td><table class="fooheader" style="width: 320pt;margin: 0 auto;padding-bottom:10pt;padding-left:10pt;">
            <tbody>
            <tr>
            <td><span style="color:white;font-weight:bold;">PLEASE HELP ME WITH THIS</span></td>
            </tr>
            </tbody>
            </table>
            </td>
            </tr>
            <tr>
            <td><table width="100%">
            <tbody>
            <tr>
            <td><div id="MainForm:j_idt19" class="ui-panel ui-widget ui-widget-content ui-corner-all" style="width: 300pt;height: 250pt;margin: 0 auto;border-top:none;"><div id="MainForm:j_idt19_content" class="ui-panel-content ui-widget-content"><table class="foo-icon-user">
            <tbody>
            <tr>

どんな助けでも大歓迎です。