在特定的屏幕尺寸上设置类(引导程序)

时间:2019-03-21 18:45:17

标签: css twitter-bootstrap bootstrap-4 column-count

我正在使用引导程序。

,并希望根据屏幕大小加载几个类,例如sm-col,xs.col。

示例:获得一个文本ID

<div id="text" class="xs-format lg-format ..."></div>

style = 
.sm-format{
 column-count: 3;
}

.xs-format{
 column-count: 1;
}

.lg-format{
 column-count: 5;
}

如果正在加载xs屏幕,则应在1列中加载文本,在sm屏幕上应加载3列,在lg屏幕上加载5列。

有任何提示吗?

问候 n00n

1 个答案:

答案 0 :(得分:0)

您可以研究Bootstrap的card columns,但如果要在更大的屏幕尺寸上显示3列以上的内容,则必须编辑媒体查询。