在BootStrap模板中**col-md-4**类和**col-xs-4**类之间有什么区别？

Question

我在Twitter BootStrap中很新,我有以下疑问.

我已经清楚BootStrap网格布局是如何工作的,所以如果我有这样的东西:

<div class="row">
    <div class="col-md-4">
    <div class="col-md-4">
    <div class="col-md-4">
</div>

只是意味着我将一行划分为4维的3列(因为BootStrap网格布局基于12列)

我的疑问与这些专栏的md定义有关.

我知道我也可以使用类似的东西 <div class="col-xs-4">

col-md-4类和col-xs-4类有什么区别？

Answer 1

基本上,

它将定义xl(超大屏幕)和md(中等屏幕)中列的行为;

例如:当屏幕为xl时,列将具有12为列的总和的比例,如果屏幕变小,则列将断开.但是,如果使用md进行设置,则可以使屏幕更小,但是在尺寸之前列不会中断:

• xs(手机用)
• sm(平板电脑)
• md(用于桌面)
• lg(适用于较大的桌面)

参考:https: //getbootstrap.com/examples/grid/