我正在尝试调整bootstarp 4传送带的大小。但是在我完成之后。剩下一些白色背景。
我尝试使背景透明，没有。边距，边框，填充为0。框阴影为无。
无济于事。
但是如果我在“ carousel”或“ float：left;”之外添加“ carousel-caption”类，白色背景会消失。
我想知道是否还有其他方法可以解决此问题。以及是什么原因造成的。
Codepen：https://codepen.io/kudratullah/pen/bmdNjp（Codepen不属于我，但与我有同样的问题。）
如果您将所有背景颜色都变为黑色，则仍然可以看到轮播的左侧/右侧仍为白色背景。
屏幕截图：Codepen
我的代码在下面：
HTML：
<div id="demo" class="carousel slide slider-horizontal" data-ride="carousel">
<ul class="carousel-indicators">
<li data-target="#demo" data-slide-to="0" class="active"></li>
<li data-target="#demo" data-slide-to="1" class="active"></li>
<li data-target="#demo" data-slide-to="2" class="active"></li>
</ul>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="Picture.jpg">
</div>
<div class="carousel-item">
<img src="Picture.jpg">
</div>
<div class="carousel-item">
<img src="Picture.jpg">
</div>
</div>
<a class="carousel-control-prev" href="#demo" data-slide="prev">
<span class="carousel-control-prev-icon"></span>
</a>
<a class="carousel-control-next" href="#demo" data-slide="next">
<span class="carousel-control-next-icon"></span>
</a>
</div>
CSS：
.slider-horizontal
{
width: 60%;
margin: auto;
}
.carousel-inner img
{
width: 100%;
}
非常感谢！
请使用其他容器类并将背景更改为黑色。这是解决方法：
html, body
{
background: black!important;
}
.container{
background:black;
}
.slider-horizontal
{
width: 60%;
margin: auto;
}
.carousel-inner img
{
width: 100%;
}<head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div id="demo" class="carousel slide slider-horizontal" data-ride="carousel">
<ul class="carousel-indicators">
<li data-target="#demo" data-slide-to="0" class="active"></li>
<li data-target="#demo" data-slide-to="1" class="active"></li>
<li data-target="#demo" data-slide-to="2" class="active"></li>
</ul>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="https://image.shutterstock.com/image-photo/lovely-beach-picture-beautiful-260nw-1554809048.jpg">
</div>
<div class="carousel-item">
<img src="https://image.shutterstock.com/image-photo/lovely-beach-picture-beautiful-260nw-1554809048.jpg">
</div>
<div class="carousel-item">
<img src="https://image.shutterstock.com/image-photo/lovely-beach-picture-beautiful-260nw-1554809048.jpg">
</div>
</div>
<a class="carousel-control-prev" href="#demo" data-slide="prev">
<span class="carousel-control-prev-icon"></span>
</a>
<a class="carousel-control-next" href="#demo" data-slide="next">
<span class="carousel-control-next-icon"></span>
</a>
</div>
</body>如果您想要其他东西，请告诉我。