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
<p> In addition to the property-specific values listed in their definitions, all properties defined in this specification also accept the inherit keyword as their property value. For readability it has not been repeated explicitly.
<ahref=http://www.w3.org/TR/css3-transitions/#animatable-types>"Animation of property types"</a>
195
+
of the <cite>CSS Transitions module</cite><adata-biblio-type=informativedata-link-type=bibliohref=#css3-transitionstitle=css3-transitions>[CSS3-TRANSITIONS]</a>
196
+
is expected to define how different kinds
197
+
of values are interpolated during a transition.)
198
+
In anticipation of that,
199
+
this module includes a line "Animatable" for each property,
Shapes from Box Values</span><aclass=self-linkhref=#shapes-from-box-values></a></h2>
676
697
677
-
<p> Shapes can be defined by reference to edges in the <ahref=http://www.w3.org/TR/CSS21/box.html#box-dimensions>CSS Box Model</a>. These edges include <ahref=http://dev.w3.org/csswg/css-backgrounds/#corner-shaping>border-radius curvature</a><adata-biblio-type=normativedata-link-type=bibliohref=#css3bgtitle=css3bg>[CSS3BG]</a>. The definitions of the <dfnclass=css-codedata-dfn-type=typedata-export="" id=typedef-box><aclass="production css-code" data-link-type=typehref=#typedef-boxtitle="<box>"><box></a><aclass=self-linkhref=#typedef-box></a></dfn> values are:
698
+
<p> Shapes can be defined by reference to edges in the <ahref=http://www.w3.org/TR/CSS21/box.html#box-dimensions>CSS Box Model</a>. These edges include <ahref=http://www.w3.org/TR/css3-background/#corner-shaping>border-radius curvature</a><adata-biblio-type=normativedata-link-type=bibliohref=#css3bgtitle=css3bg>[CSS3BG]</a>. The definitions of the <dfnclass=css-codedata-dfn-type=typedata-export="" id=typedef-box><aclass="production css-code" data-link-type=typehref=#typedef-boxtitle="<box>"><box></a><aclass=self-linkhref=#typedef-box></a></dfn> values are:
678
699
679
700
<p> The <dfndata-dfn-type=dfndata-noexport="" id=margin-box>margin-box<aclass=self-linkhref=#margin-box></a></dfn> value defines the shape
The <aclass=propertydata-link-type=propdeschref=#propdef-shape-outsidetitle=shape-outside>shape-outside</a> Property</span><aclass=self-linkhref=#shape-outside-property></a></h3>
750
771
751
-
<tableclass="definition propdef"><tr><th>Name:<td><dfnclass=css-codedata-dfn-type=propertydata-export="" id=propdef-shape-outside>shape-outside<aclass=self-linkhref=#propdef-shape-outside></a></dfn><tr><th>Value:<td>auto | [<aclass="production css-code" data-link-type=typehref=#typedef-basic-shapetitle="<basic-shape>"><basic-shape></a> || <aclass="production css-code" data-link-type=typehref=#typedef-boxtitle="<box>"><box></a>] | <aclass="production css-code" data-link-type=typehref=http://dev.w3.org/csswg/css-images-3/#image-typetitle="<image>"><image></a><tr><th>Initial:<td>auto<tr><th>Applies to:<td>floats<tr><th>Inherited:<td>no<tr><th>Media:<td>visual<tr><th>Computed value:<td>computed lengths for <aclass="production css-code" data-link-type=typehref=#typedef-basic-shapetitle="<basic-shape>"><basic-shape></a>, the <aclass="production css-code" data-link-type=typehref=http://dev.w3.org/csswg/css-images-3/#image-typetitle="<image>"><image></a> with its URI made absolute, otherwise as specified</table>
772
+
<tableclass="definition propdef"><tr><th>Name:<td><dfnclass=css-codedata-dfn-type=propertydata-export="" id=propdef-shape-outside>shape-outside<aclass=self-linkhref=#propdef-shape-outside></a></dfn><tr><th>Value:<td>auto | [<aclass="production css-code" data-link-type=typehref=#typedef-basic-shapetitle="<basic-shape>"><basic-shape></a> || <aclass="production css-code" data-link-type=typehref=#typedef-boxtitle="<box>"><box></a>] | <aclass="production css-code" data-link-type=typehref=http://dev.w3.org/csswg/css-images-3/#image-typetitle="<image>"><image></a><tr><th>Initial:<td>auto<tr><th>Applies to:<td>floats<tr><th>Inherited:<td>no<tr><th>Media:<td>visual<tr><th>Computed value:<td>computed lengths for <aclass="production css-code" data-link-type=typehref=#typedef-basic-shapetitle="<basic-shape>"><basic-shape></a>, the <aclass="production css-code" data-link-type=typehref=http://dev.w3.org/csswg/css-images-3/#image-typetitle="<image>"><image></a> with its URI made absolute, otherwise as specified<tr><th>Animatable:<td>as <ahref=#basic-shape-interpolation>specified</a> for <aclass="production css-code" data-link-type=typehref=#typedef-basic-shapetitle="<basic-shape>"><basic-shape></a>, otherwise no</table>
752
773
<p> The values of this property have the following meanings:
<tableclass="definition propdef"><tr><th>Name:<td><dfnclass=css-codedata-dfn-type=propertydata-export="" id=propdef-shape-image-threshold>shape-image-threshold<aclass=self-linkhref=#propdef-shape-image-threshold></a></dfn><tr><th>Value:<td><aclass="production css-code" data-link-type=typehref=http://dev.w3.org/csswg/css-values-3/#number-valuetitle="<number>"><number></a><tr><th>Initial:<td>0.0<tr><th>Applies to:<td>floats<tr><th>Inherited:<td>no<tr><th>Media:<td>visual<tr><th>Computed value:<td>The same as the specified value after clipping the <aclass="production css-code" data-link-type=typehref=http://dev.w3.org/csswg/css-values-3/#number-valuetitle="<number>"><number></a> to the range [0.0,1.0]</table>
839
+
<tableclass="definition propdef"><tr><th>Name:<td><dfnclass=css-codedata-dfn-type=propertydata-export="" id=propdef-shape-image-threshold>shape-image-threshold<aclass=self-linkhref=#propdef-shape-image-threshold></a></dfn><tr><th>Value:<td><aclass="production css-code" data-link-type=typehref=http://dev.w3.org/csswg/css-values-3/#number-valuetitle="<number>"><number></a><tr><th>Initial:<td>0.0<tr><th>Applies to:<td>floats<tr><th>Inherited:<td>no<tr><th>Media:<td>visual<tr><th>Computed value:<td>The same as the specified value after clipping the <aclass="production css-code" data-link-type=typehref=http://dev.w3.org/csswg/css-values-3/#number-valuetitle="<number>"><number></a> to the range [0.0,1.0]<tr><th>Animatable:<td>as <ahref=http://www.w3.org/TR/css3-transitions/#animtype-number>number</a></table>
819
840
<p> The values of this property have the following meanings:
<tr><thscope=row><adata-property="">shape-outside</a><td>auto | [<basic-shape> || <box>] | <image><td>auto<td>floats<td>no<td><td>visual<td>computed lengths for <basic-shape>, the <image> with its URI made absolute, otherwise as specified
1156
-
<tr><thscope=row><adata-property="">shape-image-threshold</a><td><number><td>0.0<td>floats<td>no<td><td>visual<td>The same as the specified value after clipping the <number> to the range [0.0,1.0]
<tr><thscope=row><adata-property="">shape-outside</a><td>auto | [<basic-shape> || <box>] | <image><td>auto<td>floats<td>no<td><td>visual<td>as specified for <basic-shape>, otherwise no<td>computed lengths for <basic-shape>, the <image> with its URI made absolute, otherwise as specified
1177
+
<tr><thscope=row><adata-property="">shape-image-threshold</a><td><number><td>0.0<td>floats<td>no<td><td>visual<td>as number<td>The same as the specified value after clipping the <number> to the range [0.0,1.0]
1178
+
<tr><thscope=row><adata-property="">shape-margin</a><td><length> | <percentage><td>0<td>floats<td>no<td><td>visual<td>as length, percentage, or calc.<td>the absolute length</table></div>
Copy file name to clipboardExpand all lines: css-shapes/Overview.src.html
+29-5Lines changed: 29 additions & 5 deletions
Original file line number
Diff line number
Diff line change
@@ -63,6 +63,20 @@ <h3 id="values">Values</h3>
63
63
64
64
In addition to the property-specific values listed in their definitions, all properties defined in this specification also accept the inherit keyword as their property value. For readability it has not been repeated explicitly.
65
65
66
+
<h3id=animations>Animated Values</h3>
67
+
68
+
It is expected that CSS will include ways
69
+
to animate transitions between styles.
70
+
(The section
71
+
<ahref="http://www.w3.org/TR/css3-transitions/#animatable-types">"Animation of property types"</a>
72
+
of the <cite>CSS Transitions module</cite> [[CSS3-TRANSITIONS]]
73
+
is expected to define how different kinds
74
+
of values are interpolated during a transition.)
75
+
In anticipation of that,
76
+
this module includes a line "Animatable" for each property,
Shapes can be defined by reference to edges in the <ahref="http://www.w3.org/TR/CSS21/box.html#box-dimensions">CSS Box Model</a>. These edges include <ahref="http://dev.w3.org/csswg/css-backgrounds/#corner-shaping">border-radius curvature</a> [[!CSS3BG]]. The definitions of the <dfn><<box>></dfn> values are:
582
+
Shapes can be defined by reference to edges in the <ahref="http://www.w3.org/TR/CSS21/box.html#box-dimensions">CSS Box Model</a>. These edges include <ahref="http://www.w3.org/TR/css3-background/#corner-shaping">border-radius curvature</a> [[!CSS3BG]]. The definitions of the <dfn><<box>></dfn> values are:
0 commit comments