问题描述
说，例如此处的示例: http://www.electrictoolbox. com/examples/wide-background-image.html
Say, like in this example here: http://www.electrictoolbox.com/examples/wide-background-image.html
当我这样做时，无论我做什么，最终都会在图像周围出现白色边框.我在做什么错了?
When I do it, I end up getting white borders around the image no matter what I do. What am I doing wrong?
推荐答案
如果您希望使用background-image: url(...);，我认为您可以.但是，如果您想玩分层游戏，则可以执行以下操作:
If you're hoping to use background-image: url(...);, I don't think you can. However, if you want to play with layering, you can do something like this:
<img class="bg" src="..." />
然后是一些CSS:
.bg
{
width: 100%;
z-index: 0;
}
您现在可以通过使用z索引等在拉伸图像上方分层内容.请注意，该图像不能包含在width: 100%;的其他任何元素中以应用于整个页面.
You can now layer content above the stretched image by playing with z-indexes and such. One quick note, the image can't be contained in any other elements for the width: 100%; to apply to the whole page.
如果您不能依赖background-size，这里是一个快速演示: http://jsfiddle.net/bB3Uc/
Here's a quick demo if you can't rely on background-size: http://jsfiddle.net/bB3Uc/
这篇关于使用CSS，如何使图像跨越页面的整个宽度作为背景图像?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！