# 185: Bermain dengan Topeng CSS - Trik CSS

Anonim

Topeng dalam CSS adalah salah satu cara untuk menyembunyikan bahagian elemen dan menunjukkan yang lain. Yang lain adalah clip-path, tetapi janganlah kita menumpukan perhatian pada hari ini. "Topeng adalah gambar; Klip adalah jalan ”adalah salah satu cara untuk memikirkan perbezaannya, walaupun ia pasti membingungkan.

Dalam video ini, kita akan melihat seberapa serupa maskdan mask-*sifatnya sama dengan sifat backgrounddan background-*sifatnya. Dan mereka dapat digunakan bersama dengan baik, kerana topeng adalah cara untuk menyembunyikan beberapa bahagian gambar tetapi masih memperlihatkan isi dan latar belakang bahagian lain.

SVG sangat bagus untuk topeng, kerana sifat vektor membolehkan mereka membuat skala dengan baik dan ukuran fail umumnya kecil bagus. Salah satu bit yang mengelirukan pada topeng adalah mask-type. The alphacara nilai bahawa bahagian-bahagian yang telus imej menjadi bahagian-bahagian yang telus topeng (yang kadang-kadang lebih fikiran-lentur daripada apa yang anda berharap). A luminancenilai cara putih adalah legap dan hitam adalah telus dan kelabu adalah di antaranya. Atau adakah sebaliknya? Dan bagaimana dengan topeng yang sudah mempunyai saluran alfa? Dan adakah kawasan dalam fail SVG tanpa apa-apa di dalamnya dianggap alfa telus? Mungkin? Mari bermain.