<div class="container-fluid text-center mt-5 pr-5 pl-5">
<div class="row mx-auto my-auto">
<div id="recipeCarousel" class="carousel slide w-100" data-ride="carousel">
<div class="carousel-inner w-100" role="listbox">
@foreach (var item in Model)
{
if (counter == 0)
{
<div class="carousel-item active">
<div class="abc col-md-2">
<a href="/Reports/Report1">
<div class="card card-body">
<div class="r9_counter db_box2">
<div style="width:100%" class="row">
<img src="/images/Cash (1).png" class="mx-auto d-block pl-3">
</div><div class="stats" style=" text-align:center;">
<span>@item.Display_Name</span>
</div>
</div>
</div>
</a>
</div>
</div>
}
else
{
<div class="carousel-item">
<div class="abc col-md-2">
<a href="/Reports/Report1">
<div class="card card-body">
<div class="r9_counter db_box2">
<div style="width:100%" class="row">
<img src="/images/Cash (1).png" class="mx-auto d-block pl-3">
</div><div class="stats" style=" text-align:center;">
<span>@item.Display_Name</span>
</div>
</div>
</div>
</a>
</div>
</div>
}
counter++;
}
</div>
<ol class="carousel-indicators carousel-indicators-numbers">
@foreach (var item in Model)
{
if (counter1 == 0)
{
<li data-target="#recipeCarousel" data-slide-to="0" class="active">1</li>
}
else
{
<li data-target="#recipeCarousel" data-slide-to=@counter1>@c</li>
}
counter1++;
c++;
}
</ol>
<a class="carousel-control-prev w-auto" href="#recipeCarousel" role="button" data-slide="prev">
<span class="carousel-control-prev-icon bg-dark border border-dark rounded-circle" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next w-auto" href="#recipeCarousel" role="button" data-slide="next">
<span class="carousel-control-next-icon bg-dark border border-dark rounded-circle" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
</div>
轮播中可能会显示30多个报告, ,一次只应显示6个数字指示符,但是如果假设有20个以上的30个项目,则应该显示6个数字,如果图像中显示的数字看起来很丑,那么轮播显示的所有数字都是6个,因此我要先显示6个数字然后箭头(>接下来的6),如何在轮播中实现呢?