为什么我的背景图片会变焦?

时间:2014-10-31 16:53:45

标签: javascript jquery html css

我有一些切换日记条目,一切正常,除了我的背景图片放大或缩小,取决于我在哪个条目。似乎它在较长的条目上放大了更多,并缩小了较短的条目。背景位于我的CSS中的body标签下。

这是我的背景,有问题。

body {
background-image: url("http://housedivided.dickinson.edu/grandreview/wp-content/uploads/2010/02/HD_4USCinfantryDetail.preview.jpg");
background-size: cover;

}

这是我的完整代码:http://jsfiddle.net/michaelpri/urz1sLa8/2/

非常感谢任何帮助。

3 个答案:

答案 0 :(得分:2)

尝试使用contain代替cover

单击时,页面高度会发生变化,背景必须覆盖所有内容,因此会放大。

这就是背景类型的作用。

答案 1 :(得分:2)

尝试使用background-size: 100% 100%;,它会将背景拉伸到屏幕尺寸

答案 2 :(得分:0)

缩放,因为在菜单下显示这些段落时body大小会发生变化。如果您将段落设置为相同的大小,则可能会停止缩放。或者如果你让它们独立于身体。也许position: absolute会有所帮助。