Demo banner轮播图 - ヾviviHuang`博客【Web前端开发】

//链接:https://pan.baidu.com/s/1SGFPP4sz0NROp1qvPIDJzg 密码:ikzq

    
        <!DOCTYPE html>
        <html lang="en">
        
        <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>banner</title>
        </head>
        //<link href="css/owl.carousel.css" rel="stylesheet">
        //<link href="css/owl.theme.css" rel="stylesheet">
        //<link href="css/owl.transitions.css" rel="stylesheet">
        //<script src="js/jquery.min.js"></script>
        //<script src="js/owl.carousel.js"></script>
        
        <style>
        * {
        margin: 0;
        padding: 0;
        }
        
        .flash {
        width: 50%;
        }
        
        .flash img {
        width: 100%;
        }
        </style>
        
        <body>
        <div class="flash">
        <div id="owl-demo" class="owl-carousel">
        <a class="item"><img src="images/flash.jpg" alt=""></a>
        <a class="item"><img src="images/flash.jpg" alt=""></a>
        </div>
        </div>
        
        <script>
        $(function () {
        $('#owl-demo').owlCarousel({
            items: 1,
            autoPlay: 3000,
            autoHeight: true,
            transitionStyle: 'fade'
            });
        });
        </script>
        
        </body>
        
        </html>

发布时间：2019-10-09