Tengo un carresul
con imágenes en mi sitio web. En dicho carrusel
quiero cambiar/personalizar el color de las flechas (para destaque o se visualice correctamente sobre las imágenes -tienen fondo blanco y previous/next por defecto, incorporan el color blanco-).
En Bootstrap, he añadido text-danger
para que las pueda repintar a rojas pero siguen en blanco.
¿Cómo podría resolverlo?
Código:
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img src="img/img1.jpg" class="d-block w-100" alt="..." width="420px" height="350px">
</div>
<div class="carousel-item">
<img src="img/img5.jpg" class="d-block w-100" alt="..." width="420px" height="350px">
</div>
<div class="carousel-item">
<img src="img/img8.jpg" class="d-block w-100" alt="..." width="420px" height="350px">
</a>
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev" class="text-danger">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next" class="text-danger">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
class=
en un elemento, pues solo se lee el primero. Deberias poner todas las clases en un único atributo class= (aun así tampoco te habria funcionado, porque no es un texto, es una imagen)