我已经搜索了很多,但是还无法弄清楚我犯了什么错误。我的标题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/