Question

您好帮助某人解决问题。问题是标题背景图像在ipad3中无法正常显示。我的css和html代码如下。这适用于所有桌面浏览器。但.headerhead背景图片隐藏在ipad3浏览器中。

小提琴链接http://jsfiddle.net/jvandhana/CL6Ru/

 <div id="header">
    <div class="headerhead">
        <div class="headerdetail">
            My Task
        </div>
    </div>
</div>

#header {
    background: url("../images/bgheadgrey.png") repeat-x scroll 0 0 rgba(0, 0, 0, 0);
    color: #FFFFFF;
}
.headerhead {
    height: 60px;
    line-height: 60px;
    text-align: center;
    margin: 0 auto;
    width: 50%;
    background: url("../images/bgtitle_large1.png") no-repeat scroll center 0 rgba(0, 0, 0, 0);
    font-size: 2em;
}

ipad3的媒体查询 / * iPad 3＆amp; 4媒体查询* /

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 2) {
    #header {
        position: relative;
        z-index: 0;
    }
    .headerhead {
        height: 60px;
        width: 600px;
        position: relative;
        z-index: 999;
    }

}

Answer 1

在iPad 3的媒体查询中，.headerhead缺少背景图片，您也必须在此处放置背景图片。

背景图像在ipad3中无法正常工作

1 个答案: