如何使div类及其图像响应

时间:2016-07-14 08:31:02

标签: html css css3

如何在所有设备中使此滑块响应。 我应该在CSS中使用它来使其响应。 因为它在添加三个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>

谢谢。

1 个答案:

答案 0 :(得分:-1)

为什么不使用bootstrap carousel?