老师,请检查

来源:2-6 编程练习

慕斯卡0165078

2020-08-04 19:40:07

<!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">

    <link rel="stylesheet" href="js/swiper/idangerous.swiper2.7.6.css">

    <link rel="stylesheet" href="js/swiper/idangerous.swiper.3dflow.css">

    <title>2-6编程</title>

    <style>

        /* @charset "utf-8"; */


        * {

            margin: 0;

            padding: 0;

        }


        html,

        body {

            width: 100%;

            height: 100%;

        }


        .swiper-container,

        .swiper-wrapper,

        .swiper-slide,

        img {

            width: 100%;

            height: 100%;

        }

    </style>

</head>


<body>

    <div class="swiper-container">

        <div class="swiper-wrapper">

            <div class="swiper-slide">

                <img src="http://climg.mukewang.com/59f2f3c60001e51206000600.jpg" alt="xx">

            </div>

            <div class="swiper-slide">

                <img src="http://climg.mukewang.com/59f2f3dc0001512e06000533.jpg" alt="xx">

            </div>

            <div class="swiper-slide">

                <img src="http://climg.mukewang.com/59f2f3fb0001725305000707.jpg" alt="xx">

            </div>

        </div>

    </div>


    <script src="js/swiper/idangerous.swiper2.7.6.min.js"></script>

    <script src="js/swiper/idangerous.swiper.3dflow.js"></script>

    <script>

        var swiper = new Swiper('.swiper-container', {

           tdFlow: {

               rotate:60,

               stretch:40,

               depth:100,

               shadows:true

           }

        });


    </script>

</body>


</html>


写回答

1回答

好帮手慕星星

2020-08-05

同学你好,代码实现效果很棒。继续加油,祝学习愉快!

0

0 学习 · 6815 问题

查看课程