css - Bootstrap-删除移动设备上的盒子阴影

我用引导程序创建了一个网页。我在.corset类中有一个.container。 .corset具有以下规格：

.corset {
  -webkit-box-shadow: 3px 3px 5px 3px rgba(186,186,186,1);
  -moz-box-shadow: 3px 3px 5px 3px rgba(186,186,186,1);
  box-shadow: 3px 3px 5px 3px rgba(186,186,186,1);
}

我想实现在移动设备上将box-shadow设置为none的方法。我知道有像.hidden-xs或.visible-*-*这样的帮助器类，但是我不想隐藏.corset，我只想在手机上编辑其规格。有没有帮手？

谢谢！

最佳答案

为此使用媒体查询。 Bootstrap对that也有很好的支持。

例如，您的情况将是这样的：

/* Landscape phones and portrait tablets */
@media (max-width: 767px) {
    .corset {
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }
}