为什么最小宽度和最大宽度不能使用相同的代码？

Question

如果图像小于375像素，只是尝试更改图像，出于某种原因，此代码不执行任何操作-但是，如果将最大宽度更改为最小宽度，则图像将在375像素以上显示10％。我不明白为什么它会以一种方式而不是另一种方式起作用？有任何想法吗？假设代码不能不正确，否则为什么要使用最小宽度！

img {
   display: block;
   margin-left: auto;
   margin-right: auto;
   width: 100%;
}
a {
   display: block;
   margin-left: auto;
   margin-right: auto;
}
@media only screen and (max-width: 375px) {
   img {
      width: 10%;
   }
    }

<img src="https://placehold.it/400x400">