Twitter bootstrap 要知道列堆栈引导的大小

我有两列

col-md-8

和

col-md-4

，我调整窗口的大小，直到一个扩展，

col-md-4

堆叠在底部，我想在这个大小做点什么

这实际上取决于您想做什么，需要更好地理解新的col--代码。请看下面的代码-

<div class="row">
    <div class="well col-xs-4 col-sm-5 col-md-6 col-lg-7">A</div>
    <div class="well col-xs-8 col-sm-7 col-md-6 col-lg-5">B</div>   
</div>

A.
B

在4种不同的大小（xs、sm、md和lg）下，div A和B的列大小都会改变

• xs（超小型）将是4/8拆分
• sm（小型）将为5/7分割
• md（中等）将为6/6拆分
• lg（大型）将采用7/5分割

这使得随着屏幕宽度的变化显示不同的布局变得非常容易

（我添加了额外的“well”类，使您更容易在布局发生变化时看到它们……）

对于中等网格（col md-），该点将添加992px（另请参见中的表格）。要在此时执行一些css，请使用媒体查询（请参阅：）

在这一点上执行一些javascript将更加复杂。使用

$（window）.resize（）

您可以找到屏幕的当前大小（

$（window），宽度

），但要触发操作，您需要准确地在点上，或者让您的操作触发屏幕上低于点的每一次调整。 您可以尝试设置如下布尔值：

var action == false
$(window).resize(function()
    { 
         if(!action && $(window).resize()<992){ yourcation(); action=true; } 
         elseif(action && $(window).resize()>=992) {action=false; }
    });

var action==false
$（窗口）。调整大小（函数（）
{ 
如果（！action&&$（window）.resize（）=992）{action=false；}
});

您还可以使用Enquire.js（）用javascript响应CSS媒体查询。有关一些示例，请参见