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
SVG transform functions of the <a element-attr for>transform</a>, <{pattern/patternTransform}>, <{linearGradient/gradientTransform}> attributes defined by the syntax above must be mapped to CSS <<transform-function>>s as follows:
677
+
SVG transform functions of the <a element-attr for>transform</a>, <{pattern/patternTransform}>, <{linearGradient/gradientTransform}> attributes defined by the syntax above are mapped to CSS <<transform-function>>s as follows:
678
678
679
679
<table class="data" id="term-matching">
680
680
<thead>
681
681
<tr>
682
682
<th>SVG transform function
683
683
<th>CSS <<transform-function>>
684
-
<th>Additional information
684
+
<th>Additional notes
685
685
</tr>
686
686
</thead>
687
687
<tbody>
688
688
<tr>
689
689
<th><a href="#svg-translate">translate</a>
690
690
<td><<translate()>>
691
-
<td>Number values interpreted as CSS <<length>>values with ''px'' units.
691
+
<td>Number values interpreted as CSS <<length>>types with ''px'' units.
692
692
</tr>
693
693
<tr>
694
694
<th><a href="#svg-scale">scale</a>
@@ -698,17 +698,17 @@ SVG transform functions of the <a element-attr for>transform</a>, <{pattern/patt
698
698
<tr>
699
699
<th><a href="#svg-rotate">rotate</a>
700
700
<td><<rotate()>>
701
-
<td>Only single value version. Number value interpreted as CSS <<angle>>value with ''deg'' unit.
701
+
<td>Only single value version. Number value interpreted as CSS <<angle>>type with ''deg'' unit.
702
702
</tr>
703
703
<tr>
704
704
<th><a href="#svg-skewX">skewX</a>
705
705
<td><<skewX()>>
706
-
<td>Number value interpreted as CSS <<angle>>value with ''deg'' unit.
706
+
<td>Number value interpreted as CSS <<angle>>type with ''deg'' unit.
707
707
</tr>
708
708
<tr>
709
709
<th><a href="#svg-skewY">skewY</a>
710
710
<td><<skewY()>>
711
-
<td>Number value interpreted as CSS <<angle>>value with ''deg'' unit.
711
+
<td>Number value interpreted as CSS <<angle>>type with ''deg'' unit.
712
712
</tr>
713
713
<tr>
714
714
<th><a href="#svg-matrix">matrix</a>
@@ -718,7 +718,7 @@ SVG transform functions of the <a element-attr for>transform</a>, <{pattern/patt
718
718
</tbody>
719
719
</table>
720
720
721
-
The SVG transform function <a href="#svg-rotate">rotate</a> with 3 values can not be mapped to a corresponding CSS <<transform-function>>. The 2 optional number values represent a horizontal translation value ''cx'' followed by a vertical translation value ''cy''. Both number values get interpreted as CSS <<length>>values with ''px'' units and define the origin for rotation. The behavior is equivalent to an initial translation by ''cx'', ''cy'', a rotation defined by the first number value interpreted as <<angle>>value with ''deg'' unit followed by a translation by ''-cx'', ''-cy''.
721
+
The SVG transform function <a href="#svg-rotate">rotate</a> with 3 values can not be mapped to a corresponding CSS <<transform-function>>. The 2 optional number values represent a horizontal translation value ''cx'' followed by a vertical translation value ''cy''. Both number values get interpreted as CSS <<length>>types with ''px'' units and define the origin for rotation. The behavior is equivalent to an initial translation by ''cx'', ''cy'', a rotation defined by the first number value interpreted as <<angle>>type with ''deg'' unit followed by a translation by ''-cx'', ''-cy''.
722
722
723
723
If the value of a <a element-attr for>transform</a> attribute is the start or end value of a CSS Transition and the SVG <a href="svg-transform-list">transform list</a> contains at least one <a href="#svg-rotate">rotate</a> transform function with 3 values, the individual SVG transform functions must get multiplied and the resulting matrix must get mapped to a <<matrix()>> CSS <<transform-function>> and used as start/end value of the CSS Transition.
724
724
@@ -1390,6 +1390,7 @@ At this point there are no information about potential privacy or security conce
1390
1390
The following changes were made since the <a href="https://www.w3.org/TR/2017/WD-css-transforms-1-20171130/">30 November 2017 Working Draft</a>.
1391
1391
* Remove specification text that makes <a element-attr for=pattern>patternTransform</a>, <a element-attr for=linearGradient>gradientTransform</a> presentation attributes representing the 'transform' property. That is going to get specified by SVG 2 [[SVG2]].
1392
1392
* Added <a href="#priv-sec">privacy and security</a> section.
1393
+
* Added special syntax for <a element-attr for>transform</a>, <{linearGradient/gradientTransform}> and <{pattern/patternTransform}> attributes.
0 commit comments