可以使用CSS的background-size和background-position属性来实现响应式背景图像定位效果。
首先，需要将background-size设置为cover，使背景图像始终填充整个容器。然后，可以使用background-position来控制背景图像在容器中的位置。可以使用百分比值或关键字（如center）来设置背景图像的位置。
以下是一个示例代码：
.container {
background-image: url('example.jpg');
background-repeat: no-repeat;
background-size: cover;
}
@media screen and (min-width: 768px) {
.container {
background-position: center;
}
}
@media screen and (min-width: 1024px) {
.container {
background-position: 20% 50%;
}
}在上面的代码中，.container是包含背景图像的容器。在小于768px的屏幕上，背景图像将始终填充整个容器，并居中。在768px至1024px之间的屏幕上，背景图像将居中显示。在大于1024px的屏幕上，背景图像将位于容器的左上角，并向右偏移20%的宽度，向下偏移50%的高度。
关键词：
background-size：用于设置背景图像的大小。background-position：用于设置背景图像在容器中的位置。cover：用于将背景图像拉伸以填充整个容器。center：用于将背景图像在水平和垂直方向上居中。 @media：用于根据屏幕大小应用不同的CSS规则。