css - 对齐背景图像(:relative) to right

Question

我的网站有一个 header background-image，它使用以下 CSS 设置样式:

.header {
    position: relative;
    min-height: 436px;
    background: url("../img/holland-canal.jpg") no-repeat;
    background-size: cover;
}

就像现在一样，在较低分辨率下调整窗口大小时，图像会向左对齐，因此图片的右侧部分会被截断。图片的右侧包含桥梁，我希望它始终可见。

是否可以将 background-image 定位为始终向右对齐，即当调整为较小的窗口大小时图像的左侧部分被切除？

Answer 1

将此添加到您的 CSS:

.header{
    background-position:right;
}

因为具有 header 类的 div 包含背景图像

输出

有关更多信息，请查看 this