1.图片切换

css样式

<style type="text/css">

            *{

                margin:0;

                padding:0;

                box-sizing: border-box;

            }

            li{

                list-style: none;

            }

            a{

                text-decoration: none;

            }

            .container{

                width:600px;

                margin:0 auto;

                border:1px solid #000;

            }

            .container>ul{

                overflow: hidden;

            }

            .container>ul>li{

                float:left;

            }

            .main>img{

                width:400px;

                height:400px;

            }

</style>

div

<div class='container'>

    <ul>

        <li>

            <a href="#">

                <img src="img/home1.jpg">

            </a>

        </li>

        <li>

            <a href="#">

                <img src="img/home2.jpg">

            </a>

        </li>

        <li>

            <a href="#">

                <img