css – 如何仅在bootstrap中将样式应用于特定的屏幕类型

我有一个通用的样式定义

.main-site-nav li a {
    padding-left: 0;
}

现在只想在超小屏幕(xs)中为.main-site-nav li应用不同的样式,如下所示.

/* xs screens only */
.main-site-nav li a {
    padding-left: 15;
}

我该怎么做？

谢谢

解决方法

BS3(v3.2.0)中使用的选择器,如果你想保持一致：

@media(max-width:767px){
  .main-site-nav li a {
    padding-left: 15;
  }
}

这将照顾你的xs屏幕

参考：Twitter Bootstrap 3: how to use media queries?