A CSS-ben való maszkolás az elemeinek elrejtésének és mások megmutatásának egyik módja. A másik az clip-path
, de ma ne erre koncentráljunk. „A maszkok képek; A klipek utak ”az egyik módszer arra, hogy gondolkodjunk a különbségen, bár ez minden bizonnyal zavaros.
Ebben a videóban megnézzük, mennyire hasonlóak mask
és mask-*
tulajdonságai valóban hasonlóak a background
és background-*
tulajdonságaihoz. És szépen együtt is használhatók, a maszk elnyeri a kép egyes részeit, de a többi rész tartalma és háttere mégis felfedhető.
Az SVG kiválóan használható maszkokhoz, mivel a vektoros természet lehetővé teszi számukra, hogy szépen méretezzenek, és az általában kis fájlméret is szép. Az egyik zavaros bit a maszkok körül a mask-type
. Az alpha
érték azt jelenti, hogy a kép átlátszó részei a maszk átlátszó részévé válnak (ami néha jobban elgondolkodtató, mint reméled). Az luminance
érték azt jelenti, hogy a fehér átlátszatlan, a fekete átlátszó, a szürke pedig kettő között van. Vagy fordítva van? És mi van a maszkokkal, amelyek már rendelkeznek alfa csatornával? És az SVG fájl területei, amelyekben nincs semmi, alfa-átlátszónak számítanak? Valószínűleg? Játsszunk egy játékot.