css – Bootstrap – 当屏幕尺寸较小时删除填充或边距

前端之家收集整理的这篇文章主要介绍了css – Bootstrap – 当屏幕尺寸较小时删除填充或边距前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
已编辑:
也许我应该问,当屏幕缩小到480px宽度以下时,哪个选择器设置侧边填充?我一直浏览bootstrap-responsiveness.css一段时间找到这个,但没有什么似乎影响这一点。

原版的
我基本上想删除任何默认填充或边际设置响应性在较小的设备屏幕上。

我有一个背景颜色覆盖在容器流体选择器,而对于较大的屏幕,他们完全100%的宽度渲染,但他们的屏幕减少到更小的尺寸,
默认情况下,Bootstrap似乎在容器 – 流体或容器上添加边距或填充。

如果我使用自定义CSS来覆盖Bootstrap的默认样式,我应该覆盖什么媒体查询或选择器来删除较小屏幕上的填充?

解决方法

专为“手机”的@media查询是..
@media (max-width: 480px) { ... }

但是,您可能需要删除任何较小屏幕尺寸的填充/边距。默认情况下,Bootstrap调整边距/填充到body,容器和navbars在978px。

这里有一些查询(在大多数情况下)为我工作:

@media (max-width: 978px) {
    .container {
      padding:0;
      margin:0;
    }

    body {
      padding:0;
    }

    .navbar-fixed-top,.navbar-fixed-bottom,.navbar-static-top {
      margin-left: 0;
      margin-right: 0;
      margin-bottom:0;
    }
}

Demo

猜你在找的CSS相关文章