我已经搜索了很多,但是还无法弄清楚我犯了什么错误。我的标题div中有一个背景图像,该背景图像在屏幕的整个宽度上展开。换句话说,即使原始图像相对较小,它也会在屏幕的整个宽度上无缝扩展。但是,当您在移动设备上(以台式机形式查看)查看站点时,图像不会充满屏幕。而是,它仅显示一个.jpg图像,并且不填充屏幕的宽度。

桌面上的图片:http://i.imgur.com/6ux68GT.png(理想)

手机上的图片:http://i.imgur.com/ApcW5xn.png(错误)

这是我在该物品上的CSS。我可以添加任何其他所需的信息。在此先感谢您的耐心配合。我正在尝试学习。

#headerWrap {
background: #343434 url(../images/template/bg.jpg) repeat-x 0 0;
}


编辑:^ typos已更正,该站点仍正确显示。并感谢大家的答复和建议。

经过更多研究,似乎图片在屏幕终止处断裂,好像图像没有延伸到初始视图宽度之外。我现在正在研究下面刚刚建议的链接。

最佳答案

我发现您的代码有两个问题:

1]您的图像路径中有一个额外的正斜杠/

2]您忘记关闭CSS声明块。您的代码末尾需要另一个}

代替这个:

#headerWrap {
background: #343434 url(../images/template//bg.jpg) repeat-x 0 0;


尝试这个:

#headerWrap {
background: #343434 url(../images/template/bg.jpg) repeat-x 0 0;
}

关于html - 网站标题div在手机上的问题,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/23234153/

10-12 12:46
查看更多