Просто простой вопрос
Я просматривал учебник по карусели из нескольких предметов и нашел его в коде css, который не мог понять
.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item {
transition: none;
}
<div class="container-fluid">
<div id="carouselExample" class="carousel slide" data-ride="carousel" data-interval="900000">
<div class="carousel-inner row w-100 mx-auto" role="listbox">
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2 active">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400/000/fff?text=1" alt="slide 1">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=2" alt="slide 2">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=3" alt="slide 3">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=4" alt="slide 4">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=5" alt="slide 5">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=6" alt="slide 6">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=7" alt="slide 7">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=8" alt="slide 8">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=9" alt="slide 9">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=10" alt="slide 10">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=11" alt="slide 11">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=12" alt="slide 12">
</div>
<div class="carousel-item col-12 col-sm-6 col-md-4 col-lg-2">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=13" alt="slide 13">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExample" role="button" data-slide="prev">
<i class="fa fa-chevron-left fa-lg text-muted"></i>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next text-faded" href="#carouselExample" role="button" data-slide="next">
<i class="fa fa-chevron-right fa-lg text-muted"></i>
<span class="sr-only">Next</span>
</a>
</div>
</div>
<br>
<br>
<p class="d-block p-5">
<br>
split up and commented css for understanding. <br>
fixed animation for previous slide. <br>
added breakpoints and slide item counts
<br><br>
based on:
<a href="https://www.codeply.com/go/s3I9ivCBYH">https://www.codeply.com/go/s3I9ivCBYH</a>
</p>
, поэтому мой вопрос в том, что такое использование классов carousel-item-right и carousel-item-left в вышеприведенном коде, когда это даже не упоминается в html код ?? Кроме того, что эти классы пытаются указать и что они значат ??