y
The y
attribute defines a y-axis coordinate in the user coordinate system.
Elements
You can use this attribute with the SVG elements described in the sections below.
For
, y
defines the y location for the light source in the coordinate system defined by the primitiveUnits
attribute on the
element.
For
, y
defines the y location for the light source in the coordinate system defined by the primitiveUnits
attribute on the
element.
For
, y
defines the y coordinate of the upper left corner of its viewport.
Note:
The y-axis coordinate of the
can also be defined with the y
geometry property. If set in CSS, the y
property value overrides the y
attribute value.
For
, y
defines the y coordinate of the upper left corner of the image.
Note:
The y-axis coordinate of the
can also be defined with the y
geometry property. If set in CSS, the y
property value overrides the y
attribute value.
For
, y
defines the y coordinate of the upper left corner of its area of effect. The exact effect of this attribute is influenced by the maskUnits
attribute.
For
, y
defines the y coordinate of the upper left corner of the tile pattern. The exact effect of this attribute is influenced by the patternUnits
and patternTransform
attributes.
For
, y
defines the y coordinate of the upper left corner of the shape.
Note:
The y-axis coordinate of the
can also be defined with the y
geometry property. If set in CSS, the y
property value overrides the y
attribute value.
For ,
y
defines the y coordinate of the upper left corner of its viewport.
Note:
The y-axis coordinate of the can also be defined with the
y
geometry property. If set in CSS, the y
property value overrides the y
attribute value.
For
, if it contains a single value, y
defines the y coordinate where the content text position must be placed. The content text position is usually a point on the baseline of the first line of text. The exact content text position is influenced by other properties, such as text-anchor
or direction
.
If it contains multiple values, y
defines the y coordinate of each individual glyph from the text. If there are fewer values than glyphs, the remaining glyphs are placed in line with the last positioned glyph. If there are more values than glyphs, the extra values are ignored.
text {
font: 40px sans-serif;
}
line {
fill: none;
stroke: red;
stroke-width: 0.5px;
stroke-dasharray: 2px;
}
For
, if it contains a single value, y
defines the y coordinate where the content text position must be placed. The content text position is usually a point on the baseline of the first line of text. The exact content text position is influenced by other properties, such as text-anchor
or direction
.
If it contains multiple values, y
defines the y coordinate of each individual glyph from the text. If there are fewer values than glyphs, the remaining glyphs are placed in line with the last positioned glyph. If there are more values than glyphs, the extra values are ignored.
text {
font: 40px sans-serif;
}
line {
fill: none;
stroke: red;
stroke-width: 0.5px;
stroke-dasharray: 2px;
}
For ,
y
defines the y coordinate of the upper left corner of the referenced element.
Note:
Declaring a
or
value in CSS using the y
geometry property overrides the y-axis coordinate of the set by the
y
attribute in some browsers. This behavior is at-risk.
Examples
Specifications
See also
- CSS
y
property