代替：（chrome38）の人が箱を作ることができる時代遅れのブラウザでは、

Question

長い時間前に反転...

背景の正反対だった色を選択するoutline-color: invertを使用することが可能でした。

今日、このような素晴らしい機能がもはや存在し:(ヨーヨーがちょうど背景の反対色の境界とボックスを表示したい私のためのアイデアを持っていないのですか？

（今日クローム（39）コンピューティングoutline-color: invertoutline-color:transparentへ。

黒brackgroundにoutline-color: rgb(255,255,255)にレンダリングされているoutline-color: invert前。）あなたのアイデアを

感謝。

Answer 1

おそらく、THIあなたのための秘訣はありますか？

.background { 
 
    display: inline-block; 
 
    margin: 10px; 
 
    padding: 20px; 
 
} 
 
.box { 
 
    border: 3px solid white; 
 
    height: 100px; 
 
    width: 160px; 
 
} 
 
.invert { 
 
    mix-blend-mode: difference; 
 
}

<div class="background" style="background: #ff0000"> 
 
    <div class="box invert"></div> 
 
</div> 
 

 
<div class="background" style="background: #000000"> 
 
    <div class="box invert"></div> 
 
</div> 
 

 
<div class="background" style="background: #ffffff"> 
 
    <div class="box invert"></div> 
 
</div>

http://codepen.io/Frikki/pen/BNpKYb