Tout d'abord, je vais vous montrer le carrousel Bootstrap Picture. L'effet est le suivant. Si vous pensez que l'effet est assez bon, veuillez continuer à lire et vous référer au code d'implémentation.
Je ne dirai pas beaucoup de bêtises, je vais simplement vous publier le code. Le code spécifique est le suivant:
<! Doctype html> <html lang = "zh-cn"> <éadf> <meta charset = "utf-8"> <meta http-equiv = "x-ua-compatible" contenu = "ie = edge"> <meta name = "Viewport" contenu = "width = device-width, premier, et 1"> <! - Le bilan de device ci-dessus? Tout autre contenu * doit * les suivre! -> <ititle> Picture Carousel_01 </ title> <! - Bootstrap -> <link href = "../ bootstrap-3.3.5-dist / css / bootstrap.min.css" rel = "Stylesheet"> <script src = "../ js / jquet-2.1.4 src = "../ bootstrap-3.3.5-Dist / js / bootstrap.min.js"> </cript> </ad> <body> <! - Auteur: Kyle Time: 2016-02-20 Description: Carouselate-Interval = "4000" Dwell Time / Image soutient la direction gauche et droite du clavier à la direction du carouse id = "Carousel-Example-Generic"> <Ol> <li data-target = "# Carousel-Example-Generic" Data-Slide-to = "0"> </li> <li data-target = "# Carousel-Example-Generic" Data-Slide-to = "1"> </li> <li data-target = "# caresel-example-generic" Data-Target = "# Carousel-Example-Generic" Data-Slide-to = "1"> </li> <li data-target = "# carousel-example" Data-Slide-to = "2"> </li> <li data-target = "# Carousel-Example-Generic" Data-Slide-to = "3"> </li> </frousel-Example-Generic "Data src = "../ img / image carrousel / pic01.jpg" /> </ div> <div> <img src = "../ IMG / Carousel / pic02.jpg" /> <! - Texte à afficher sur l'image -> <v> <h3> Lenovo Campus Ambassador </h3> </v> </v> src = "../ img / image carrousel / pic03.jpg" /> </ div> <div> <img src = "../ iMg / Picture Carousel / pic04.jpg" /> </ div> <! - Controls -> <a href = "# carelsel-example-generic" role = "Button" data-lide = "prev"> <panque aria-hidden = "true"> </span> <span> précédent </span> </a> <a href = "# Carousel-Example-Generic" Role = "Button" Data-Slide = "Next"> <span Aria-Hidden = "True"> </span> <span> Next </pan> </a> Réglage d'attribut CSS sans intervention humaine -> <cript> $ (". Carousel"). Carousel ({interval: 4000}) </cript> </body> </html>Ce qui précède est l'exemple de code de l'affichage d'effet de carrousel d'image basé sur Bootstrap basé sur Bootstrap que l'éditeur vous a présenté. J'espère que cela vous sera utile. Si vous avez des questions, veuillez me laisser un message et l'éditeur vous répondra à temps. Merci beaucoup pour votre soutien au site Web Wulin.com!