jquery - 如何使用jquery根据屏幕宽度添加css

Question

我喜欢编写一段代码，将 margin:0 auto; 添加到 div。

var bestsize = 1445;
 var width = $('.first-image').width();
if( width >= bestsize){
    $('.first-image').css({margin : '0 auto'});

}
else {
    $('.first-image').css({margin :' 0 0 -1px 0'});

}

first-image 是一个有背景图片的 div

这就是我所拥有的，我认为它应该有效。但也许我没有正确表述。目前什么也不会发生。我感觉我没有以正确的方式使用宽度。如果这个解决方案不好，有人可以给我一个想法吗？

非常感谢:)

Answer 1

为什么需要通过 java 脚本而不是使用 CSS 媒体查询来执行此操作？

.first-image{
  margin: 0 0 -1px 0;
}

@media (min-width: 1445px) {
  .first-image{
    margin : 0 auto;
  }
}