# 185: Hraní s maskami CSS - Triky CSS

Anonim

Maskování v CSS je jedním ze způsobů, jak skrýt části prvku a ukázat ostatním. Další je clip-path, ale dnes se na to nezaměřujme. "Masky jsou obrazy; Klipy jsou cesty “je jeden způsob, jak přemýšlet o rozdílu, i když je to jistě matoucí.

V tomto videu se podíváme na to, jak podobné maska jeho mask-*vlastnosti jsou opravdu podobné vlastnostem backgrounda background-*. A mohou být použity společně pěkně, sinces a mask je způsob, jak skrýt některé části obrazu, ale přesto odhalit obsah a pozadí ostatních částí.

SVG je skvělé pro masky, protože vektorová povaha jim umožňuje pěkně škálovat a obecně malá velikost souboru je hezká. Jedním z matoucích kousků kolem masek je mask-type. Mezi alphahodnota znamená, že průhledné části obrazu se stanou průhledné části masky (což je někdy více mysl-ohýbání než doufáte). luminanceHodnota znamená bílá je neprůhledná a černá je transparentní a šedé je mezi nimi. Nebo je to naopak? A co masky, které již mají alfa kanál? A jsou oblasti v souboru SVG, v nichž není nic, považovány za alfa průhledné? Pravděpodobně? Pojďme si zahrát.