Mascarea în CSS este o modalitate de a ascunde părți ale elementului și de a le arăta altora. Un alt lucru este clip-path, dar să nu ne concentrăm astăzi pe asta. „Măștile sunt imagini; Clipurile sunt căi ”este o modalitate de a gândi diferența, deși cu siguranță devine confuză.
În acest videoclip, vom analiza cât de similare maskși mask-*proprietățile sale sunt foarte similare cu proprietățile backgroundși background-*. Și pot fi utilizate împreună frumos, deoarece o mască este un mod de a ascunde unele părți ale unei imagini, dar dezvăluie totuși conținutul și fundalul celorlalte părți.
SVG este excelent pentru măști, deoarece natura vectorială le permite să se scaleze frumos, iar dimensiunea fișierului în general mică este frumoasă. Unul dintre biții confuzi din jurul măștilor este mask-type. De alphaînseamnă o valoare pe care părțile transparente ale imaginii devin transparente părți ale măștii (care este , uneori , mai minte-îndoire decât sperați). O luminancevaloare înseamnă că albul este opac, iar negrul este transparent, iar griul este între ele. Sau este invers? Și ce zici de măștile care au deja un canal alfa? Și zonele dintr-un fișier SVG fără nimic în ele sunt considerate alfa transparente? Probabil? Hai să jucăm.