請看下圖:

想象底部的藍色矩形，混合混合模式:差異，慢慢向頂部移動。我希望它忽略紅色條紋，并在穿過它時保持藍色，但當它在綠色條紋上時使用混合混合模式。我該如何著手做這件事？

你可以把混合混合模式放在你想要藍色矩形改變的地方，而不要放在不改變藍色矩形的地方。

這里有一個簡單的例子:

<style>
  .green {
    width: 200px;
    height: 100px;
    background: lime;
    mix-blend-mode: difference;
  }
  
  .red {
    width: 200px;
    height: 100px;
    background: red;
  }
  
  .blue {
    width: 100px;
    height: 100px;
    background: blue;
    animation: move 5s infinite linear;
    osition: absolute;
  }
  
  @keyframes move {
    0% {
      margin-top: 0px;
    }
    100% {
      margin-top: -300px;
    }
  }
</style>
<div class="green"></div>
<div class="red"></div>
<div class="blue"></div>