divクラスとその画像を反応的にする方法

Question

すべてのデバイスでこのスライダを反応させる方法。 私はそれを反応的にするためにCSSで使用する必要があります。 は3つのdivクラスを追加した後に応答しません。 は

<div class="col-lg-12" style="background: rgb(255, 255, 255) none repeat scroll 0% 0%; top: 0px; margin-top: 0px; border-top-width: 0px; padding-top: 0px; width: 1100px; height: 530px; left: 0px; padding-left: 0px; padding-right: 0px;"> 


    <div class="container"> 
       <div class="col-lg-11"> 
        <div id="jssor_1" style="position: relative; margin: 0 auto; top: 0px; left: 0px; width: 1040px; height: 500px; overflow: hidden; visibility: hidden;"> 
         <!-- Loading Screen --> 
         <div class="container"> 
          <div data-u="slides" style="cursor: default; position: relative; top: 0px; left: 0px; width: 1040px; height: 500px; overflow: hidden;"> 
           <div data-p="112.50" style="display: none;"> 
            <img class="img-rounded img-responsive" data-u="image" style="padding-top: 26px;"src="images/birch-899553_1920.jpg" /> 
           </div> 
           <div data-p="112.50" style="display: none;"> 
            <img class="img-rounded img-responsive" data-u="image" style="padding-top: 26px;" src="images/house-949265_1920.jpg" /> 
           </div> 
           <div data-p="112.50" style="display: none;"> 
            <img class="img-rounded img-responsive" data-u="image" style="padding-top: 26px;" src="images/nature-958406_1920.jpg" /> 
           </div> 
           <div data-p="112.50" style="display: none;"> 
            <img class="img-rounded img-responsive" data-u="image" style="padding-top: 26px;" src="images/birch-112829_1920.jpg" /> 
           </div> 
           <div data-p="112.50" style="display: none;"> 
            <img class="img-rounded img-responsive" data-u="image" style="padding-top: 26px;" src="images/park-454416_1920.jpg" /> 
           </div> 
           <div data-p="112.50" style="display: none;"> 
            <img class="img-rounded img-responsive" data-u="image" style="padding-top: 26px;"src="images/columbine-981541_1920.jpg" /> 
           </div> 
           <div data-p="112.50" style="display: none;"> 
            <img class="img-rounded img-responsive" data-u="image" style="padding-top: 26px;" src="images/garden-705485_1920.jpg" /> 
           </div> 
          </div> 
         </div> 
         <!-- Bullet Navigator --> 
         <div data-u="navigator" class="jssorb01" style="bottom:16px;right:16px;"> 
          <div data-u="prototype" style="width:12px;height:12px;"></div> 
         </div> 
         <!-- Arrow Navigator --> 
         <span data-u="arrowleft" class="jssora02l" style="top:0px;left:8px;width:55px;height:55px;" data-autocenter="2"></span> 
         <span data-u="arrowright" class="jssora02r" style="top:0px;right:8px;width:55px;height:55px;" data-autocenter="2"></span> 
        </div> 
        <!-- #endregion Jssor Slider End --> 
       </div> 
      </div> 
     </div> 

ありがとうありがとう。

Answer 1

なぜブートストラップカルーセルを使用しないのですか？