首页 > 代码库 > 汇农PC个人中心总结

汇农PC个人中心总结

1. 技巧总结

1. 使用 padding 编写灵活的 登录 | 注册, ‘|‘ 竖线, 参考: http://www.imooc.com/learn/710

    font-size: 0;    border-left: 1px solid;    padding: 10px 4px 2px;    margin-left: 8px;

2. 使用过渡完成悬浮效果: 参考 http://www.mi.com/ 

transition: all .2s linear;      &:hover {           box-shadow: 0 15px 30px rgba(0,0,0,0.1);           transform: translate3d(0, -2px, 0);  Y 轴向上    }

3. 悬浮图片放大

&:hover {    .imgs {       img {         transform: scale(1.1);        }      }    }   .imgs {      img {        transition: all .5s;       } }

 

 

汇农PC个人中心总结