响应式内嵌div引导

Question

我正在尝试在div中为xs大小制作文本。它适用于大尺寸的桌面，但不适合移动设备的下面是我的代码：

<div class="row"> 
     <div style="background-color:lightblue;color:#33CAFF" 
       class="col-lg-2 col-md-2 col-xs-3">STEP 1 
     </div> 
     <div style="background-color:#33CAFF;color:white" 
       class="col-lg-4 col-md-4 col-xs-5">2.SELECT VEHICLES & EXTRAS 
     </div> 
     <div style="background-color:white;color:gray" 
       class="col-lg-2 col-md-2 col-xs-2">STEP 3 
     </div> 
     <div style="background-color:white;color:gray" 
       class="col-lg-2 col-md-2 col-xs-2">STEP 4 
     </div> 
     </div> 

Answer 1

引导可能不支持类做这个

您可以添加自定义类，并用一点点的CSS这样。

HTML

<div class="row"> 
    <div style="background-color:lightblue;color:#33CAFF" 
    class="col-lg-2 col-md-2 col-xs-3 xs-text-center">STEP 1 
    </div> 
    <div style="background-color:#33CAFF;color:white" 
    class="col-lg-4 col-md-4 col-xs-5 xs-text-center">2.SELECT VEHICLES & EXTRAS 
    </div> 
    <div style="background-color:white;color:gray" 
    class="col-lg-2 col-md-2 col-xs-2 xs-text-center">STEP 3 
    </div> 
    <div style="background-color:white;color:gray" 
    class="col-lg-2 col-md-2 col-xs-2 xs-text-center">STEP 4 
    </div> 
</div> 

CSS

@media (max-width: 768px) { 
    .xs-text-center { 
    text-align: center; 
    } 
}