CSS mask-repeat property
Description
CSS mask-repeat specifies how the mask images are placed after they have been sized and positioned.
Syntax
mask-repeat : no-repeat | repeat | repeat-x | repeat-y | space | round
Property values
repeatDefault
-
The mask mask image is repeated along both axes to fill the painting area completely. It is the same as repeat repeat.
mask-repeat: repeat;
no-repeat
-
The mask image should not be repeated to fill the painting area.
mask-repeat: no-repeat;
repeat-x
-
The mask image is repeated along x-axis only. It is the same as repeat no-repeat
mask-repeat: repeat-x;
repeat-y
-
The mask image is repeated along y-axis only. It is the same as no-repeat repeat
mask-repeat: repeat-y;
space
-
In this case, the mask images are repeated and spaced out (kept at a distance) so as to fill the painting area completely. The first and last mask images must touch the corners of the painting area.
mask-repeat: space;
round
-
The image is repeated untill it fills the background painting area. If it does not fit the painting area a whole number of times, the mask image is rescaled so as to fit the area.
mask-repeat: round;
Applicable to
It applies to all elements
From web4college, the free CSS digger
#CSS digger
Was this article helpful?