鍍金池/ 問答/HTML/ bootstrap中col-xs-*在屏幕縮小時沒起作用

bootstrap中col-xs-*在屏幕縮小時沒起作用

代碼:

<div class="container-fluid">
      <h1>Hello, world!</h1>

      <div class="row">
         <div class="col-xs-6 col-sm-3" style="background-color: red;">
            <p>lskdflsjdlfsjdlfsdljsdsdfsdfsdfsdfsf</p>
         </div>
         <div class="col-xs-6 col-sm-3" style="background-color: green;">
            <p>lskdflsjdlfsjdlfsdljsdsdfsdfsdfsdfsf</p>
         </div>
         <div class="col-xs-6 col-sm-3" style="background-color: blue;">
            <p>lsdflksjdfsldkfjlsdjflskjd</p>
         </div>
         <div class="col-xs-6 col-sm-3" style="background-color: yellow;">
            <p>lsdjflksjdfkmsldmflsdmlksdf</p>
         </div>
      </div>
      </div>

縮小時效果圖:
圖片描述

回答
編輯回答
呆萌傻

我知道了,我的bootstrap是4.0.0的,里面的Extra small不是col-xs-, 而是col-

2017年4月21日 03:53
編輯回答
做不到

是不是你縮小的程度還不夠

xs的作用范圍是小于768px,sm是768-992px,你這里沒寫md和lg,所以屏幕大于768的時候sm的配置生效,小于的時候xs生效

2018年8月6日 19:42