首页 > 代码库 > css3实现简易dock
css3实现简易dock
<style> *{margin:0px; padding:0px;} #dock{width:100%; text-align:center; margin:0 auto; position:fixed; bottom:0px; } #dock img{ transition:all 0.5s; width:98px; height:98px; border:0px; } #dock img:hover{transform:scale(1.5,1.5) translateY(-25px); -webkit-transform:scale(1.5,1.5) translateY(-30px); margin:0 10px; } </style> <div id="dock"> <a href="#" ><img src="../Pictures/dock/alienware.png" /></a> <a href="#" ><img src="../Pictures/dock/alienware.png" /></a> <a href="#" ><img src="../Pictures/dock/alienware.png" /></a> <a href="#" ><img src="../Pictures/dock/alienware.png" /></a> </div>
就是那么简单,只要调一下 translateY 以及 margin的距离就好了
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。