Question

情况： 我有一个div元素，上面有logo，nav＆amp;内部的介绍文字。这需要背后的背景图像。

问题： 背景图片需要具有相同的尺寸（100％宽度），但无论窗口大小如何，都需要相同的高度。因此它可以水平重新调整尺寸，但我不希望它垂直重新调整大小以使其垂直变小。

标题 - 正常屏幕尺寸 http://s25.postimg.org/fh7npk5am/header_normal.jpg

标题 - 窗口调整大小，按比例缩小 http://s25.postimg.org/685hffwem/header_resized.jpg

任何帮助或建议值得赞赏！请询问您是否需要更多信息或详细信息。

----＆GT; JSFiddle在评论中＆lt; ----

Answer 1

认为您可以使用“background-size：cover;” 这应该始终将背景图像保持至少100％。

您可能希望将div高度设置为固定的像素数，例如“height：250px”

Answer 2

试试这些css属性：

background-size:cover;

或

background-size:contain;

或

    html{
    background: url('http://i.stack.imgur.com/jGlzr.png') no-repeat 0 0 scroll;
    background-color:#0C0C0C;
    background-size: 100% 100%;
    height:100%;
    width:100%;
}

CSS背景图像;大小调整

2 个答案: