jQuery Mobile header - 如何重复 x 背景并放上图像？

Question

我需要设置标题。我正在尝试 repeat-x 背景并在上面放一张图片，但没有成功。

HTML:

<div data-role="page" id="page1">
<div data-role="header">
    <div><img src="jquery-mobile/images/logo.png" class="ui-header"></div>
</div>

CSS:

    .ui-header{
    background-image: url(http://www.mybizonline.co.il/book/tno/jquery-mobile/images/bg.jpg);
    background-repeat: repeat-x; 
    width: 1024px;
    height: 275px;
}

它应该是这样的:

bg 重复到 x，图片在 bg 上

有谁知道为什么它不起作用？

Answer 1

html:

<div data-role="page" id="page1">
<div id="bg_wrapper" data-role="header">
    <img src="jquery-mobile/images/logo.png" class="ui-header">
</div>

CSS:

#bg_wrapper {
    background: url('...') repeat-x;
    text-align: center;  // To center your img
}