我想在引導程式中將文本顯示為輪播指示器。該屬性默認text-indent設定為-999px .carousel-indicators [data-bs-target]，我將其更改為0。這里是代碼：
<div id="carouselExampleIndicators" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0" class="active"
aria-current="true" aria-label="Slide 1" style="
text-indent: 0;">Test Button</button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1"
aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="2"
aria-label="Slide 3"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="3"
aria-label="Slide 4"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<!-- Some other content for this slide -->
<img src="..." class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<!-- Some other content for this slide -->
<img src="..." class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<!-- Some other content for this slide -->
<img src="..." class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<!-- Some other content for this slide -->
<img src="..." class="d-block w-100" alt="...">
</div>
</div>
</div>
我的要求是以文本為指標的輪播幻燈片。能解釋一下為什么內容是開箱即用的嗎？以及如何將文本顯示為指標？
提前致謝！
uj5u.com熱心網友回復：
只需將“文本”類放在包含文本的按鈕上：
<button type="button" class="text">Test Button</button>
然后試試這個 CSS：
.carousel-indicators [data-bs-target] {
width: 20px;
height: 20px;
border-radius: 10px;
overflow: hidden;
}
.carousel-indicators .text[data-bs-target] {
width: auto;
height: 20px;
text-indent: 0;
}
我希望這會奏效。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/451818.html
上一篇：OSError:[Errno8]Execformaterror:'/home/ec2-user/Desktop/chromedriver'在AWSEC2ARM風味機器中使用Chro