css - 图片<比页面居中，图片>比页面居中

Question

在 CSS 中是否可以根据浏览器页面的尺寸来处理背景图像的位置，或者我应该使用 javascript 来处理它？

当图像大于页面时，它应该向左对齐

当图像小于页面时，应居中对齐

Answer 1

媒体查询 - 它们根据浏览器大小更改 CSS 样式。

#img { 
  width: 1000px;
  margin: 0 auto;
}

@media 
screen and (max-device-width: 1000px), 
screen and (max-width: 1000px) {

  #img { 
    float: left; 
    margin: 0;
  }
}