五彩斑斓的黑

在2019年的10月1日，我用一句话惹怒了我家UI，“你这页面又是抄袭的谁家的？”。至此我开始了自己切ICON的生涯。

而这些icon需要有各种颜色，红色，灰色，蓝色，红色等等。

就在我切了几百个图标后，我突然发现给我一个图标，我可以用CSS生成任意颜色的图标（含恨而终）。

那么我是怎么实现的呢?

上代码

<style>
   *{
      margin: 0 auto;
    }
    div{
      width: 26px;
      height: 26px;
      overflow: hidden;
    }
  
    img{
      position: relative;
      left: -26px;
      border-right: 26px solid transparent;
      filter: drop-shadow(26px 0 #ff0000);// 红色#ff0000 黄色 #ffff00 ...任意颜色
    }
</style>
  
<div>
    <img src="https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2019/11/8/16e499b8c7d26363~tplv-t2oaga2asx-image.image" alt="">
 </div>
 
 

这么做既省去切图的麻烦，有减少了HTTP请求。我真是是小机灵鬼。

我觉得这组织语言的能力对得起我62分的语文成绩。

                                        ---来自xxxx技术有限公司程虚员