twitter-bootstrap – Carousel图像没有填充bootstrap 3中的宽度
发布时间:2020-12-18 00:06:20 所属栏目:安全 来源:网络整理
导读:我对这个响应性的东西太过新了.我正在尝试使用新bootstrap 3中的旋转木马,由于某种原因,图像没有填充旋转木马的宽度.所有图像都具有相同的确切尺寸(1000×395),无论我做什么,它都不会一直填充.非常感谢任何和所有帮助!这是我正在使用的代码和截图: div cla
我对这个响应性的东西太过新了.我正在尝试使用新bootstrap 3中的旋转木马,由于某种原因,图像没有填充旋转木马的宽度.所有图像都具有相同的确切尺寸(1000×395),无论我做什么,它都不会一直填充.非常感谢任何和所有帮助!这是我正在使用的代码和截图:
<div class="row"> <div class="col-md-12"> <div id="carousel" class="carousel slide"> <ol class="carousel-indicators"> <li data-target="#carousel" data-slide-to="0" class="active"></li> <li data-target="#carousel" data-slide-to="1"></li> <li data-target="#carousel" data-slide-to="2"></li> <li data-target="#carousel" data-slide-to="3"></li> <li data-target="#carousel" data-slide-to="4"></li> <li data-target="#carousel" data-slide-to="5"></li> <li data-target="#carousel" data-slide-to="6"></li> <li data-target="#carousel" data-slide-to="7"></li> <li data-target="#carousel" data-slide-to="8"></li> <li data-target="#carousel" data-slide-to="9"></li> </ol> <div class="carousel-inner"> <div class="item active"> <img src="/images/temp/1.jpg" class="img-responsive"> </div> <div class="item"> <img src="/images/temp/2.jpg" class="img-responsive"> </div> <div class="item"> <img src="/images/temp/3.jpg" class="img-responsive"> </div> <div class="item"> <img src="/images/temp/4.jpg" class="img-responsive"> </div> <div class="item"> <img src="/images/temp/5.jpg" class="img-responsive"> </div> <div class="item"> <img src="/images/temp/6.jpg" class="img-responsive"> </div> <div class="item"> <img src="/images/temp/7.jpg" class="img-responsive"> </div> <div class="item"> <img src="/images/temp/8.jpg" class="img-responsive"> </div> <div class="item"> <img src="/images/temp/9.jpg" class="img-responsive"> </div> <div class="item"> <img src="/images/temp/10.jpg" class="img-responsive"> </div> </div> <a class="left carousel-control" href="#carousel" data-slide="prev"> <span class="icon-prev"></span> </a> <a class="right carousel-control" href="#carousel" data-slide="next"> <span class="icon-next"></span> </a> </div> </div> <!-- /col-md-12 --> </div> <!-- /row --> 解决方法
为每个img行添加width =“100%”: < img src =“/ images / temp / 2.jpg”width =“100%”> 它将按比例增加高度以保持纵横比.
(编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |