SVG y Атрибут
Опубликовано: 25 Февраля, 2022
Атрибут y определяет координату оси Y в пользовательской системе координат.
Синтаксис:
y = "координата y"
Значения атрибутов:
- length: длина, на которой мы хотим установить ось x.
- процент: процент, в котором мы хотим установить ось абсцисс.
Мы будем использовать атрибут y для установки координаты y для элементов.
Пример 1: Группа прямоугольных элементов с разными осями Y.
Выход:

Example 2: A group of rectangle elements with the same y-axis.
<!DOCTYPE html> <html> <body> <svg width="200" height="200" viewBox="0 0 300 300"> <rect x="20" y="20" width="60" height="60" fill="green"/> <rect x="120" y="20" width="60" height="60" fill="green"/> <rect x="220" y="20" width="60" height="60" fill="green"/> </svg> </body> </html> |
Выход:

Example 3: Use percentage value.
<!DOCTYPE html> <html> <body> <svg width="200" height="200" viewBox="0 0 300 300"> <rect x="30%" y="30%" width="60" height="60" fill="green"/> </svg> </body> </html> |
Выход: