Bootstrap敏感問題

Question

這個想法是，如果我使用container類它的工作形式放大和縮小，但它不響應。如果我使用container-fluid類，它適用於響應式，但不適用於放大或縮小。我如何使這項工作具有響應能力以及放大或縮小？這是HTML代碼的一部分：

<div class="container-fluid"> 
     <div class ="row"> 
       <div class="col-xs-3"></div> 
       <div class="col-xs-6"> 
        <div class="row svu-info1"> 
         <div class="col-xs-6 col-sm-6 svu-info1-text1"> 
          <p class="text-header">&Icirc;nve&#539;i, te consul&#539;i, faci schimb de cuno&#x219;tin&#539;e, te specialiezi! </p> 

          <p class="text-body"><span class="p-header"></span> este un program intern care 
          ofer&#259; posibilitatea tuturor colegilor s&#259; se dezvolte 
          profesional. Este un centru de cuno&#x219;tin&#539;e &#x219;i expertiz&#259;, 
          este locul unde ne ajut&#259;m reciproc &#x219;i unde &#238;ntreb&#259;rile 
          noastre &#238;&#x219;i g&#259;sesc r&#259;spunsul.</p> 
         </div> 
         <div class="col-xs-6 col-sm-6 bg-img1"> 
          <!-- <img src ="<?php echo Yii::app()->getBaseUrl(); ?>/images/pages/svu/img_svu_1.jpg" alt="img_svu_1"> --> 
         </div> 
        </div> 
       </div> 
       <div class="col-xs-3"></div> 

     </div> 
     <div class ="row bg-white"> 
       <div class="col-xs-3"></div> 
       <div class="col-xs-6"> 
        <div class="row svu-info2"> 
          <div class="col-xs-6 col-sm-6 svu-info2-text2"> 
          <p class="">TEST University include 10 comunit&#259;&#539;i tehnice,</p> 
          <p class="">fiecare dintre ele av&#226;nd un decan - coordonator &#x219;i un nucleu tehnic</p> 
          </div> 
          <div class="col-xs-6 col-sm-6"> 
          <div class="row elements1"> 
           <div class="col-xs-4 col-sm-4 first">.NET</div> 
           <div class="col-xs-4 col-sm-4 second"> 
            <!-- <img src="<?php echo Yii::app()->getBaseUrl(); ?>/images/pages/svu/img_svu_android.png" alt="" /> --> 
           </div> 
           <div class="col-xs-4 col-sm-4 third">ANDROID</div> 
          </div> 
          </div> 
        </div> 
       </div> 
       <div class="col-xs-3"></div> 
     </div> 

     <div class ="row bg-white"> 
       <div class="col-xs-3"></div> 
       <div class="col-xs-6"> 
        <div class="row"> 
         <div class ="col-xs-2 bg-img2"> 
          <!-- <img src="<?php echo Yii::app()->getBaseUrl(); ?>/images/pages/svu/img_svu_ios.png" alt="" /> --> 
         </div> 
         <div class ="col-xs-10 elements2"> 
          <div class="row row1"> 
            <div class="col-sm-2 elem1">IOS</div> 
            <div class="col-sm-2 elem2"> 
             <!-- <img src="<?php echo Yii::app()->getBaseUrl(); ?>/images/pages/svu/img_svu_pm.png" alt="" /> --> 
            </div> 
            <div class="col-sm-2 elem3">PM</div> 
            <div class="col-sm-2 elem4">C/C++</div> 
            <div class="col-sm-2 elem5">DataBase</div> 
          </div> 
          <div class="row row2"> 
            <div class="col-sm-2 elem1">DevOps</div> 
            <div class="col-sm-2 elem2">Java</div> 
            <div class="col-sm-2 elem3">QA</div> 
            <div class="col-sm-2 elem4"> 
             <!-- <img src="<?php echo Yii::app()->getBaseUrl(); ?>/images/pages/svu/img_svu_qa.png" alt="" /> --> 
            </div> 
            <div class="col-sm-2 elem5">WEB</div> 
          </div> 
         </div> 
        </div> 
       </div> 
       <div class="col-xs-3"></div> 
     </div> 
    </div> 

Answer 1

你可以在你的div既提供container和container-fluid類。例如<div class="container-fluid container">。也許它會爲你工作。