Home > Web Front-end > Bootstrap Tutorial > Is it possible to use bootstrap carousel image without internet connection?

Is it possible to use bootstrap carousel image without internet connection?

angryTom
Release: 2019-07-29 10:18:35
Original
2488 people have browsed it

Is it possible to use bootstrap carousel image without internet connection?

If you want to know more about bootstrap, you can click: Bootstrap Tutorial

Someone asked if bootstrap carousel images can be displayed without an internet connection? If you are developing locally, this is of course possible, because the carousel chart is implemented using js and css. We only need to download the bootstrap development package, and then reference its js and css files in the files we need. Let me introduce to you how to create bootstrap recording images.

A carousel is a looping slideshow:

How to create a carousel

The following example creates a simple image carousel effect:

<div id="demo" class="carousel slide" data-ride="carousel">
 
  <!-- 指示符 -->
  <ul class="carousel-indicators">
    <li data-target="#demo" data-slide-to="0" class="active"></li>
    <li data-target="#demo" data-slide-to="1"></li>
    <li data-target="#demo" data-slide-to="2"></li>
  </ul>
 
  <!-- 轮播图片 -->
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img src="https://img.php.cn/upload/article/000/000/040/5d3e569459bb7121.jpg">
    </div>
    <div class="carousel-item">
      <img src="https://img.php.cn/upload/article/000/000/040/5d3e56afa458d274.jpg">
    </div>
    <div class="carousel-item">
      <img src="https://img.php.cn/upload/article/000/000/040/5d3e56a3e68b7503.jpg">
    </div>
  </div>
 
  <!-- 左右切换按钮 -->
  <a class="carousel-control-prev" href="#demo" data-slide="prev">
    <span class="carousel-control-prev-icon"></span>
  </a>
  <a class="carousel-control-next" href="#demo" data-slide="next">
    <span class="carousel-control-next-icon"></span>
  </a>
 </div>
Copy after login

Add descriptions to carousel images

Add

Related labels:
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Issues
There is no bootstrap custom video tutorial
From 1970-01-01 08:00:00
0
0
0
Laravel: Problem using bootstrap locally
From 1970-01-01 08:00:00
0
0
0
html5 - Problem with bootstrap modifying style
From 1970-01-01 08:00:00
0
0
0
Introducing bootstrap is invalid
From 1970-01-01 08:00:00
0
0
0
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template