html - Bootstrap 3 偏移忽略大小

标签 html css twitter-bootstrap twitter-bootstrap-3

我为中型屏幕设置了偏移,但当屏幕较大时,偏移仍然发生。这是我的 html 片段,我该如何解决这个问题?

<div class="col-lg-6 col-sm-12">
  <div class="row">
    <div class="col-lg-12 col-md-3 col-md-offset-3"></div>
  </div>
</div>

最佳答案

在 Bootstrap 中,设备大小特定的类会影响类的大小以及所有更高的大小,除非被覆盖。因此,当然,col-md-offset-3 也将出现在大屏幕中。您可以使用 col-lg-offset-0 为大屏幕“覆盖”此类。

<div class="col-lg-6 col-sm-12">
  <div class="row">
    <div class="col-lg-12 col-md-3 col-md-offset-3 col-lg-offset-0"></div>
  </div>
</div>

来自docs :

Grid classes apply to devices with screen widths greater than or equal to the breakpoint sizes, and override grid classes targeted at smaller devices. Therefore, applying any .col-md- class to an element will not only affect its styling on medium devices but also on large devices if a .col-lg- class is not present.

关于html - Bootstrap 3 偏移忽略大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27328082/

相关文章:

css - GtkCSS : Naming objects by id in CSS doesn't work

javascript - 个人数据间隔 bootstrap carousel 4

html - 媒体查询在调整大小时不适用

javascript - Bootstrap javascript wordpress 问题数据切换 ="collapse"

javascript - 如何将图像放在其他图像的一部分上

javascript - 如何确定切换文本区域焦点?

javascript - 悬停下拉溢出

html - Foundation 5 - Div Heights 中的响应式 bg IMAGE

javascript - Bootstrap 附加功能无法正常工作

css - 将变量的值附加到选择器@如果它存在(使用变量存在)