glide实现一个图片幻灯片轮换效果代码-html代码-BFW代码库

glide实现一个图片幻灯片轮换效果代码

代码语言：html

所属分类：幻灯片

代码描述：glide实现一个图片幻灯片轮换效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/glide.core.min.css">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/glide.theme.min.css">
    <style>
        .glide {
          max-width: 960px;
          margin: 0 auto;
        }
        
        .glide__slides {
          list-style: none;
          padding: 0;
        }
        .glide__slides li {
          margin: 0;
        }
        
        .glide__slide img {
          display: block;
          width: 100%;
          margin: 0 auto;
          border-radius: 5px;
        }
        
        .glide__arrows {
          width: 100%;
          bottom: 30px;
        }
        
        .glide__arrow {
          color: #dbdbdb;
          border: none;
          background: rgba(0, 0, 0, 0.4);
        }
        .glide__arrow.glide__arrow--left {
          left: 0;
          border-radius: 0 3px 0 3px;
        }
        .glide__arrow.glide__arrow--right {
          right: 0;
          border-radius: 3px 0 3px 0;
        }
    </style>



</head>

<body translate="no">
    <div class="glide">.........完整代码请登录后点击上方下载按钮下载查看