Bonjour à tous,
Je suis en train d'apprendre le développement web de façon autodidacte et je réalise pour cela mon premier site web avec Bootstrap en HTML/CSS pour une association culturel et je bloque sur plusieurs éléments pour finalisé celui-ci dont un carrousel Bootstrap.
Je voudrait faire en sorte que les 3 images du carrousel soit à la même taille aussi bien en hauteur que longueur, un peu comme s'ils était placé dans un container égalisant leur résolution.
Voici le code, si vous avez des pistes je suis preneur ! Merci d'avance pour votre aide.
Modifié par AdrienSergent (10 May 2019 - 19:04)
Je suis en train d'apprendre le développement web de façon autodidacte et je réalise pour cela mon premier site web avec Bootstrap en HTML/CSS pour une association culturel et je bloque sur plusieurs éléments pour finalisé celui-ci dont un carrousel Bootstrap.
Je voudrait faire en sorte que les 3 images du carrousel soit à la même taille aussi bien en hauteur que longueur, un peu comme s'ils était placé dans un container égalisant leur résolution.
Voici le code, si vous avez des pistes je suis preneur ! Merci d'avance pour votre aide.
<section>
<div class="container">
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100" src="Images/main-image.jpg" alt="First slide">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="Images/57159958_459719448098720_7897758066303565824_n.jpg" alt="Second slide">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="Images/56857552_621062855032435_8575637363131154432_n.jpg" alt="Third slide">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
</section>
Modifié par AdrienSergent (10 May 2019 - 19:04)