You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: css-masking-1/Overview.src.html
+3-3Lines changed: 3 additions & 3 deletions
Original file line number
Diff line number
Diff line change
@@ -200,7 +200,7 @@ <h3 id="the-clip-path">Clipping Shape: the 'clip-path' property</h3>
200
200
201
201
For SVG elements without associated CSS layout box, the <i>used value</i> for <avaluefor=mask-clip>content-box</a>, <avaluefor=mask-clip>padding-box</a>, <avaluefor=mask-clip>border-box</a> and <avaluefor=mask-clip>margin-box</a> is <avaluefor=clip-path>fill-box</a>.
202
202
203
-
For elements with associated CSS layout box, the <i>used value</i> for <avaluefor=clip-path>fill-box</a>, <avaluefor=clip-path>stroke-box</a> and <avaluefor=clip-path>view-box</a> is <em>border-box</em>.
203
+
For elements with associated CSS layout box, the <i>used value</i> for <avaluefor=clip-path>fill-box</a>, <avaluefor=clip-path>stroke-box</a> and <avaluefor=clip-path>view-box</a> is <avaluefor=mask-clip>border-box</a>.
A computed value of other than ''none'' results in the creation of a <aspec="css21">stacking context</a> [[!CSS21]] the same way that CSS 'opacity' [[CSS3COLOR]] does.
374
+
A computed value of other than ''none'' results in the creation of a <aspec="css21">stacking context</a> [[!CSS21]] the same way that CSS 'opacity' [[CSS3COLOR]] does for values other than ''1''.
375
375
376
376
A mask reference that is an empty image (zero width or zero height), that fails to download, is not a reference to an <aelement>mask</a> element, is non-existent, or that cannot be displayed (e.g. because it is not in a supported image format) is ignored. It still counts as an image layer but does not mask the element.
See “<ahref="#MaskValues">Mask processing</a>” on how to process the mask image.
769
769
770
-
A computed value of other than ''none'' results in the creation of a <aspec="css21">stacking context</a> [[!CSS21]] the same way that CSS 'opacity' [[CSS3COLOR]] does.
770
+
A computed value of other than ''none'' results in the creation of a <aspec="css21">stacking context</a> [[!CSS21]] the same way that CSS 'opacity' [[CSS3COLOR]] does for values other than ''1''.
771
771
772
772
'mask-box-source' and 'mask-image' can be specified independent of each other. If both properties have a value other than ''none'', the element is masked by both masking operations one after the other.
<p>For SVG elements without associated CSS layout box, the <adata-link-type=dfnhref=http://dev.w3.org/csswg/css-cascade-3/#used-valuetitle="used value">used value</a> for <aclass=css-codedata-link-for=mask-clipdata-link-type=valuehref=#valuedef-content-box0title=content-box>content-box</a>, <aclass=css-codedata-link-for=mask-clipdata-link-type=valuehref=#valuedef-padding-box0title=padding-box>padding-box</a>, <aclass=css-codedata-link-for=mask-clipdata-link-type=valuehref=#valuedef-border-box0title=border-box>border-box</a> and <aclass=css-codedata-link-for=mask-clipdata-link-type=valuehref=#valuedef-margin-box0title=margin-box>margin-box</a> is <aclass=css-codedata-link-for=clip-pathdata-link-type=valuehref=#valuedef-fill-box0title=fill-box>fill-box</a>.
251
251
252
-
<p>For elements with associated CSS layout box, the <adata-link-type=dfnhref=http://dev.w3.org/csswg/css-cascade-3/#used-valuetitle="used value">used value</a> for <aclass=css-codedata-link-for=clip-pathdata-link-type=valuehref=#valuedef-fill-box0title=fill-box>fill-box</a>, <aclass=css-codedata-link-for=clip-pathdata-link-type=valuehref=#valuedef-stroke-box0title=stroke-box>stroke-box</a> and <aclass=css-codedata-link-for=clip-pathdata-link-type=valuehref=#valuedef-view-box0title=view-box>view-box</a> is <em>border-box</em>.
252
+
<p>For elements with associated CSS layout box, the <adata-link-type=dfnhref=http://dev.w3.org/csswg/css-cascade-3/#used-valuetitle="used value">used value</a> for <aclass=css-codedata-link-for=clip-pathdata-link-type=valuehref=#valuedef-fill-box0title=fill-box>fill-box</a>, <aclass=css-codedata-link-for=clip-pathdata-link-type=valuehref=#valuedef-stroke-box0title=stroke-box>stroke-box</a> and <aclass=css-codedata-link-for=clip-pathdata-link-type=valuehref=#valuedef-view-box0title=view-box>view-box</a> is <aclass=css-codedata-link-for=mask-clipdata-link-type=valuehref=#valuedef-border-box0title=border-box>border-box</a>.
<p>A computed value of other than <spanclass=cssdata-link-type=maybetitle=none>none</span> results in the creation of a <adata-link-spec=css21data-link-type=dfnhref=http://www.w3.org/TR/CSS21/visuren.html#x43title="stacking context">stacking context</a><adata-biblio-type=normativedata-link-type=bibliohref=#css21title=css21>[CSS21]</a> the same way that CSS <aclass=propertydata-link-type=propdeschref=http://dev.w3.org/csswg/css-color-3/#opacitytitle=opacity>opacity</a><adata-biblio-type=informativedata-link-type=bibliohref=#css3colortitle=css3color>[CSS3COLOR]</a> does.
416
+
<p>A computed value of other than <spanclass=cssdata-link-type=maybetitle=none>none</span> results in the creation of a <adata-link-spec=css21data-link-type=dfnhref=http://www.w3.org/TR/CSS21/visuren.html#x43title="stacking context">stacking context</a><adata-biblio-type=normativedata-link-type=bibliohref=#css21title=css21>[CSS21]</a> the same way that CSS <aclass=propertydata-link-type=propdeschref=http://dev.w3.org/csswg/css-color-3/#opacitytitle=opacity>opacity</a><adata-biblio-type=informativedata-link-type=bibliohref=#css3colortitle=css3color>[CSS3COLOR]</a> does for values other than <spanclass=cssdata-link-type=maybetitle=1>1</span>.
417
417
418
418
<p>A mask reference that is an empty image (zero width or zero height), that fails to download, is not a reference to an <adata-link-type=elementhref=#elementdef-masktitle=mask>mask</a> element, is non-existent, or that cannot be displayed (e.g. because it is not in a supported image format) is ignored. It still counts as an image layer but does not mask the element.
<p>See “<ahref=#MaskValues>Mask processing</a>” on how to process the mask image.
715
715
716
-
<p>A computed value of other than <spanclass=cssdata-link-type=maybetitle=none>none</span> results in the creation of a <adata-link-spec=css21data-link-type=dfnhref=http://www.w3.org/TR/CSS21/visuren.html#x43title="stacking context">stacking context</a><adata-biblio-type=normativedata-link-type=bibliohref=#css21title=css21>[CSS21]</a> the same way that CSS <aclass=propertydata-link-type=propdeschref=http://dev.w3.org/csswg/css-color-3/#opacitytitle=opacity>opacity</a><adata-biblio-type=informativedata-link-type=bibliohref=#css3colortitle=css3color>[CSS3COLOR]</a> does.
716
+
<p>A computed value of other than <spanclass=cssdata-link-type=maybetitle=none>none</span> results in the creation of a <adata-link-spec=css21data-link-type=dfnhref=http://www.w3.org/TR/CSS21/visuren.html#x43title="stacking context">stacking context</a><adata-biblio-type=normativedata-link-type=bibliohref=#css21title=css21>[CSS21]</a> the same way that CSS <aclass=propertydata-link-type=propdeschref=http://dev.w3.org/csswg/css-color-3/#opacitytitle=opacity>opacity</a><adata-biblio-type=informativedata-link-type=bibliohref=#css3colortitle=css3color>[CSS3COLOR]</a> does for values other than <spanclass=cssdata-link-type=maybetitle=1>1</span>.
717
717
718
718
<p><aclass=propertydata-link-type=propdeschref=#propdef-mask-box-sourcetitle=mask-box-source>mask-box-source</a> and <aclass=propertydata-link-type=propdeschref=#propdef-mask-imagetitle=mask-image>mask-image</a> can be specified independent of each other. If both properties have a value other than <spanclass=cssdata-link-type=maybetitle=none>none</span>, the element is masked by both masking operations one after the other.
0 commit comments