【问题标题】:set class on specific screen size (bootstrap)在特定屏幕尺寸上设置类(引导程序)
【发布时间】:2019-03-22 04:50:10
【问题描述】:

我正在使用引导程序。

并且想根据屏幕大小加载几个类,例如 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

【问题讨论】:

  • 为什么不使用媒体查询?
  • 只想使用引导程序,.. 媒体查询是一种解决方案,但我确信引导程序中有一些东西可以解决这样的问题。
  • 我不太明白你的问题。 Bootstrap 不会在元素上“加载”类。它使用媒体查询来应用包含某些类的 CSS 样式。

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


【解决方案1】:

您可以查看 Bootstrap 的 card columns,但如果您希望在更大的屏幕尺寸上超过 3 列,则必须编辑媒体查询。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-12-21
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多