Maskovanie v CSS je jedným zo spôsobov, ako skryť časti prvku a ukázať ostatným. Ďalším je clip-path, ale nezameriavajme sa na to dnes. „Masky sú obrazy; Klipy sú cesty “, to je jeden zo spôsobov, ako premýšľať o rozdiele, hoci to bude určite mätúce.
V tomto videu sa pozrieme na to, ako podobné maska jeho mask-*vlastnosti sú skutočne podobné vlastnostiam backgrounda background-*. A dajú sa pekne spolu použiť, hriech masky je spôsob, ako skryť niektoré časti obrázka, ale napriek tomu odhaliť obsah a pozadie ostatných častí.
SVG je vynikajúci pre masky, pretože vektorová povaha im umožňuje pekné škálovanie a všeobecne malá veľkosť súboru je pekná. Jedným z mätúcich kúskov masiek je mask-type. Táto alphahodnota znamená, že priehľadné časti obrázka sa stanú priehľadnými časťami masky (čo niekedy ohýba myseľ viac, ako dúfate). luminanceHodnota znamená biela je nepriehľadná a čierna je transparentný a šedej je medzi nimi. Alebo je to naopak? A čo masky, ktoré už majú alfa kanál? A sú oblasti v súbore SVG, v ktorých nie je nič, považované za alfa priehľadné? Pravdepodobne? Poďme sa hrať.