Bootstrap图片轮播效果详解

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
 <!-- Indicators -->
 <ol class="carousel-indicators">
  <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
  <li data-target="#carousel-example-generic" data-slide-to="1"></li>
  <li data-target="#carousel-example-generic" data-slide-to="2"></li>
 </ol>

 <!-- Wrapper for slides -->
 <div class="carousel-inner" role="listbox">
  <div class="item active">
   <img src="/UploadFiles/2021-04-02/...">

在src中插入图片已为图片设置大小 



还可以为其加上标题


<div class="item">
 <img src="/UploadFiles/2021-04-02/...">


参考 


1.Bootstrap官网中文文档
2.菜鸟学堂Bootstrap教程
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。