我司的 UI 虽然不是 处女座，但认（挑）真（剔）程度也与之不相上下了。作为一枚前端，当然也不好意思掉链子，所以在 UI 小哥的督促下，会最大可能地完美实现视觉稿。于是乎，一些本来一行实现的东西，为了效果美观，会用更多代码做得更加细致。
上效果：
UI 要求是，底部阴影宽度比图片的宽度略小，然后整体是个轮播效果，每张图片的阴影颜色不一样。
假设图片的容器为banner, 为了减少html上的节点，尽量用伪元素来做。由于层级嵌套的关系，不能直接把图片盖在阴影上，所以要有两个伪元素，一个before用于生成阴影， 一个after用于放背景图片。后者的z-index要高于前者。
按这个思路写mixin
@mixin banner($shadowcolor,$bannerpic){
width: 
最低0.47元/天 解锁文章
806
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
