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-script而不是使用CSS媒体查询呢？

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

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

Answer 2

首先，您可以在调试控制台中看到任何内容吗？

是否加载了jQuery？

试试这个：

你需要把它包起来

$(document).ready(function()({});

在页面准备就绪时加载功能

和/或

$(window).resize(function(){});

在页面调整大小时加载函数。

我还会使用$('.first-image').css('margin', '0 auto');

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

2 个答案: