18910140161

HTML-row-sm和row-cols-sm-n(其中n<12)的作用是什么?我'我见过col-sm-n(其中n<12)的用法,但我不知道row-sm-stack overflow

顺晟科技

2022-10-18 12:57:47

117

的用法

根据我的理解,当我们给出COL-SM-N时,当设备屏幕PX小于SM指定的值时,行中的列将按堆栈顺序排列。那么什么是ROW-SM,它的工作方式是否类似于COL-SM?什么是ROW-COLS-SM-N.

此外,当我使用:

<代码>.boxx{显示:Flex}<;DIV类=";ROW-SM MT-2 PT-5 M-5 BOXX";>;<;DIV类=";COL-SM-3小盒PY-5 ML-3 MT-2";>;a<;/DIV>;<;DIV类=";COL-SM-3小盒PY-5 ML-5 MT-2";>;B<;/DIV>;<;DIV类=";COL-SM-3小盒PY-5 ML-5 MT-2";>;C<;/DIV>;<;/DIV>;

我得到的输出是响应列,但去掉Boxx类,我的输出就变成了堆栈,这是非常随机的堆栈。当我将ROW-SM更改为Just Row时,我得到了列,但它们的响应性很差。当我减少屏幕宽度时,他们进入了与之前相同的糟糕堆栈形式。我对Bootstrap和Flex的概念很陌生,所以我试图理解它们之间的区别。

P.S:代码是容器类的一部分。


顺晟科技:

.boxx{ display:flex } <div class="row-sm mt-2 pt-5 m-5 boxx"> <div class="col-sm-3 small-box py-5 ml-3 mt-2 ">a</div> <div class="col-sm-3 small-box py-5 ml-5 mt-2 ">b</div> <div class="col-sm-3 small-box py-5 ml-5 mt-2 ">c</div> </div> 不是Bootstrap 4.X或Bootstrap 5中的标准类。我相信您正在查找列上的.row-sm,以使屏幕上的等宽宽度大于SM断点,堆栈小于SM断点—参考文档https://getbootstrap.com/docs/4.6/layout/grid/#stacked-to-horizontal

<代码><;link rel=“ stylesheet ” href=“ UNK1@4.6.0/dist/CSS/bootstrap.min.CSS ” integrity=“ sha384-b0vp5xmatw1+k9krqjqerjvtumqw0npezvf6l/z6nronj3ouofufpcjeuqouq2+l ” crossorigin=“ anonymous ”>;<;DIV类=“容器”>;<;DIV类=“行mt-2 pt-5 ”>;<;DIV类=“ col-sm BG-info ”>;A<;/DIV>;<;DIV类=“ col-sm BG-danger ”>;乙<;/DIV>;<;DIV类=“ col-sm BG-primary ”>;C<;/DIV>;<;/DIV>;<;/DIV>;

  • TAG:
相关文章
我们已经准备好了,你呢?
2024我们与您携手共赢,为您的企业形象保驾护航