css手风琴

2021-07-10 10:05

阅读:498

标签:hover   margin   alt   http   width   hidden   oat   idt   ansi   

style>
        .box{ width:  1000px; height: 450px; margin:0 auto; overflow: hidden;}
        .box div{ width: 20%;  float: left; transition: all 1s;}
        img{  width: 800px;}
     .box:hover div{ width: 5%; }
        .box div:hover{ width: 70%;}
    style>
head>
body>
    div class="box">
        div>img src="http://www.jq22.com/demo/css3sfq20170111/img/1.png" alt="">div>
        div>img src="http://www.jq22.com/demo/css3sfq20170111/img/2.png" alt="">div>
        div>img src="http://www.jq22.com/demo/css3sfq20170111/img/3.png" alt="">div>
        div>img src="http://www.jq22.com/demo/css3sfq20170111/img/4.png" alt="">div>
        div>img src="http://www.jq22.com/demo/css3sfq20170111/img/5.png" alt="">div>
        
    div>

 

css手风琴

标签:hover   margin   alt   http   width   hidden   oat   idt   ansi   

原文地址:http://www.cnblogs.com/rain-null/p/7090410.html


评论


亲,登录后才可以留言!