我正在使用 ng-bootstrap 的轮播：
<ngb-carousel [showNavigationArrows]="showNavigationArrows" [showNavigationIndicators]="showNavigationIndicators">
<ng-template ngbSlide>
<div class="picsum-img-wrapper">
<img src="assets\fsfhjllz_vegetables-banner.png" class="mh-100" style="width: 100%; height: 30vh; object-fit:cover;">
</div>
</ng-template>
<ng-template ngbSlide>
<div class="picsum-img-wrapper">
<img src="assets\vh9oeys6_fruit-banner.png" class="mh-100" style="width: 100%; height: 30vh; object-fit: cover;">
</div>
</ng-template>
</ngb-carousel>
它会在图像顶部显示此文本，例如：幻灯片 1 of 2 。
如何删除此文本并仅显示图像。
在浏览器中检查时显示如下：
<div role="tabpanel" class="carousel-item" id="slide-ngb-slide-1">
<span class="sr-only"> Slide 2 of 2 </span> // this one
这是这个和平的源代码：
<span class="sr-only" i18n="Currently selected slide number read by screen reader@@ngb.carousel.slide-number">
Slide {{i + 1}} of {{c}}
</span>
我看到隐藏此文本的两种可能性：
- 添加CSS隐藏
.carousel-inner .sr-only隐藏这个元素，例如
.carousel-inner .sr-only {
display: none;
}
- 设置翻译键的值
ngb.carousel.slide-number到一个空字符串。国际化指导方针 https://ng-bootstrap.github.io/#/guides/i18n.
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
