Javascript 垂直响应背景图像

我有一个全页背景图像，有一个10px的薄页边距，无论浏览器大小如何，我都希望在图像的每一面都保留这个图像。到目前为止，除底部外，所有侧面都很好。有没有一种方法，我可以有一个垂直响应的背景图像只使用css？我不喜欢使用Javascript，但如果这是唯一的解决方案，我是开放的

.background-image {
    display: inline-block; 
    height: 100%;
    width: 98%;
    margin: 1%;
    background: url('/wp-content/themes/woodsy/images/background-walnut-test.jpg') no-repeat center center fixed;
    background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover; 
}

---

如果您想要与宽度具有相同的1%边距，只需将高度更改为宽度的98%

如果要精确设置10px的边距，请指定边距，并使用计算器设置宽度和高度：

margin: 10px;
height: calc(100% - 20px);
width: calc(100% - 20px);

---

看到它在这里工作：

我不确定我是否理解这个问题，但如果我理解了，我想我确切地知道你在找什么

而不是使用：

    height: 100%;

尝试：

“vh”代表“视口高度”。它应该动态地将图像的高度设置为浏览器窗口的全高

---

希望这能有所帮助。

谢谢，这对我很有用。现在正在研究浏览器支持。有些设备，如vmax，在Iphone safari中存在主要问题，我不确定VH是否正确奇怪的是，calc功能适用于我的宽度，但不适用于我的高度。无论出于何种原因，我的背景图像不接受以百分比表示的高度，只接受实际尺寸。无论如何谢谢你！您需要添加位置太绝对或固定即可

    height: 100vh;