y

Атрибут y задаёт координату по оси y в пользовательской системе координат.

Элементы

Этот атрибут можно использовать с элементами SVG, описанными в разделах ниже.

<feBlend>

Для <feBlend> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feColorMatrix>

Для <feColorMatrix> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feComponentTransfer>

Для <feComponentTransfer> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feComposite>

Для <feComposite> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feConvolveMatrix>

Для <feConvolveMatrix> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feDiffuseLighting>

Для <feDiffuseLighting> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feDisplacementMap>

Для <feDisplacementMap> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feDropShadow>

Для <feDropShadow> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feFlood>

Для <feFlood> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feFuncA>

Для <feFuncA> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feFuncB>

Для <feFuncB> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feFuncG>

Для <feFuncG> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feFuncR>

Для <feFuncR> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feGaussianBlur>

Для <feGaussianBlur> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feImage>

Для <feImage> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feMerge>

Для <feMerge> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feMergeNode>

Для <feMergeNode> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feMorphology>

Для <feMorphology> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feOffset>

Для <feOffset> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<fePointLight>

Для <fePointLight> атрибут y задаёт координату источника света по оси y в системе координат, определённой атрибутом primitiveUnits элемента <filter>.

<feSpecularLighting>

Для <feSpecularLighting> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feSpotLight>

Для <feSpotLight> атрибут y задаёт координату источника света по оси y в системе координат, определённой атрибутом primitiveUnits элемента <filter>.

<feTile>

Для <feTile> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<feTurbulence>

Для <feTurbulence> атрибут y задаёт минимальную координату по оси y для области отображения примитива.

<filter>

Для <filter> атрибут y задаёт координату по оси y верхнего левого угла области отображения фильтра.

<foreignObject>

Для <foreignObject> атрибут y задаёт координату по оси y верхнего левого угла его области просмотра.

<image>

Для <image> атрибут y задаёт координату по оси y верхнего левого угла изображения.

<mask>

Для <mask> атрибут y задаёт координату по оси y верхнего левого угла области действия маски. Точное действие этого атрибута зависит от атрибута maskUnits.

<pattern>

Для <pattern> атрибут y задаёт координату по оси y верхнего левого угла узора плитки. Точное действие этого атрибута зависит от атрибутов patternUnits и patternTransform.

<rect>

Для <rect> атрибут y задаёт координату по оси y верхнего левого угла фигуры.

<svg>

Для <svg> атрибут y задаёт координату по оси y верхнего левого угла его области просмотра.

<text>

Для <text> атрибут y при наличии одного значения задаёт координату по оси y, в которой должно располагаться положение текстового содержимого. Обычно положение текстового содержимого — это точка на базовой линии первой строки текста. Точное положение текстового содержимого зависит от других свойств, таких как text-anchor или direction.

Если атрибут содержит несколько значений, y задаёт координату по оси y для каждого отдельного символа текста. Если значений меньше, чем символов, оставшиеся символы располагаются на одной линии с последним позиционированным символом. Если значений больше, чем символов, лишние значения игнорируются.

<svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
  <!-- horizontal line to materialized the text base line -->
  <line x1="0" y1="40%" x2="100%" y2="40%" />
  <line x1="0" y1="60%" x2="100%" y2="60%" />
  <line x1="0" y1="80%" x2="100%" y2="80%" />

  <!-- vertical line to materialized the x positioning -->
  <line x1="5%" y1="0" x2="5%" y2="100%" />
  <line x1="55%" y1="0" x2="55%" y2="100%" />

  <!-- y with a single value -->
  <text y="40%" x="5%">SVG</text>

  <!-- y with multiple values -->
  <text y="40%,60%,80%" x="55%">SVG</text>
</svg>

text {
  font: 40px sans-serif;
}

line {
  fill: none;
  stroke: red;
  stroke-width: 0.5px;
  stroke-dasharray: 2px;
}

<tspan>

Для <tspan> атрибут y при наличии одного значения задаёт координату по оси y, в которой должно располагаться положение текстового содержимого. Обычно положение текстового содержимого — это точка на базовой линии первой строки текста. Точное положение текстового содержимого зависит от других свойств, таких как text-anchor или direction.

Если атрибут содержит несколько значений, y задаёт координату по оси y для каждого отдельного символа текста. Если значений меньше, чем символов, оставшиеся символы располагаются на одной линии с последним позиционированным символом. Если значений больше, чем символов, лишние значения игнорируются.

<svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
  <!-- horizontal line to materialized the text base line -->
  <line x1="0" y1="40%" x2="100%" y2="40%" />
  <line x1="0" y1="60%" x2="100%" y2="60%" />
  <line x1="0" y1="80%" x2="100%" y2="80%" />

  <!-- vertical line to materialized the x positioning -->
  <line x1="5%" y1="0" x2="5%" y2="100%" />
  <line x1="55%" y1="0" x2="55%" y2="100%" />

  <text>
    <!-- y with a single value -->
    <tspan y="40%" x="5%">SVG</tspan>

    <!-- y with multiple values -->
    <tspan y="40%,60%,80%" x="55%">SVG</tspan>
  </text>
</svg>

text {
  font: 40px sans-serif;
}

line {
  fill: none;
  stroke: red;
  stroke-width: 0.5px;
  stroke-dasharray: 2px;
}

<use>

Для <use> атрибут y задаёт координату по оси y верхнего левого угла указанного элемента.

Примеры

В этом примере показаны три элемента <rect>, каждый из которых имеет значение y меньшее, чем у предыдущего.

<svg viewBox="0 0 100 300" xmlns="http://www.w3.org/2000/svg">
  <rect y="220" x="20" width="60" height="60" fill="red" />
  <rect y="120" x="20" width="60" height="60" fill="yellow" />
  <rect y="20" x="20" width="60" height="60" fill="purple" />
</svg>

Спецификации

См. также

• Свойство y CSS