1.ビデオの背景を透明にする方法
Web開発では、インタラクティブな特殊効果の中にはもっと複雑で、ビデオを使って実現したいものもありますが、ビデオの背景色に問題があり、透明にできないため、デザイナーは背景をブレンドして作成する必要があります。ビデオ。開発コストはまだかなり高く、メンテナンスは頭痛の種です。MP4ビデオの背景色を透明にする良い方法はありますか？
持ってる！
CSSのmix-blend-mode属性曲線で国を救うことができ ます。
mix-blend-modeブレンドモードの1つはカラーフィルターと呼ばれます。screenつまり、非常に興味深い特性があります。つまり、黒が他の要素と混合されると、透明に見えます。
したがって、ビデオの背景色が黒に設定されている限り、ビデオの背景色の透明効果は非常に単純であり、同時に次のCSSを設定する必要があります。
ビデオ{
ミックスブレンドモード：画面;
}
例えば：
ベースマップは次のとおりです。
次に、雨が降っているビデオがあります（再生していない場合はクリックしてください）：
この時点で、プレーンイメージの上にビデオをオーバーレイし、ビデオのブレンディングモードを画面に設定します。ビデオの背景が透明になり、雨の動的効果が下のイメージによく表示されていることがわかります。以下に示す表示（再生していない場合はクリック）（リアルタイムレンダリング、非IEブラウザでの効果）：
とても簡単です！
IEブラウザとの互換性を必要としないすべてのプロジェクトで使用できます。
あなたはこのスキルのヒントを学んだに違いないと思います！
2.結論
フィルタ画面の詳細については、次の記事を参照してください：「CSSミックスブレンドモードフィルタ画面のブレンドモードの詳細」。
プレビュー、記事は今後2週間で更新されますので、ご用意ください。