Система координат в CSS для создания сложных форм работает следующим образом: 12
- Элементу задаются размеры. 1 Высота и ширина элемента используются для установления системы координат. 1 Если размеры явно не указаны, свойства форм работать не будут. 2
- Создаётся референсный блок. 4 Это виртуальный прямоугольник вокруг фигуры, который формирует систему координат для её отрисовки. 4 За начало координат принимается верхний левый угол этого прямоугольника, при этом ось X направлена вниз, а Y — вправо. 4
- Каждая фигура определяется как набор точек, расположенных с использованием пары координат. 1 Изменение координат точки напрямую повлияет на созданную фигуру. 1
Координаты для фигур могут быть заданы в любых единицах, допустимых в CSS: px, em, % и так далее. 4