html - 像 github 404 这样的响应式背景图片

Question

我正在尝试开发一个底部有以下背景图片的页面。

我的灵感来自 GITHUB 404 page's background .如果您尝试增大或减小页面大小，它会保持固定为 100% 宽度。

知道如何用我的图像实现这种效果吗？

Answer 1

您可以通过具有重复图像背景的全宽 div 来实现。
HTML:

<div id="bg">
</div>

CSS:

#bg {
    background-image: url("http://i.stack.imgur.com/08pYU.png");
    width: 100%;
    height: 221px;
}

演示 jsfiddle .