如何使用CSS将x = 50，y = 50作为中心旋转一条线（x1 = 50，y1 = 50，x2 = 50，y2 = 10）？

Question

它类似于绕z轴旋转。来了解变换起源，但它接受了％，这对我不起作用。请帮助

Answer 1

如果我理解正确，您正尝试使用CSS转换SVG行。不幸的是，这不会是跨浏览器兼容的。非跨浏览器兼容版本采用px值并将其视为SVG单元。你可以这样做：

transform: rotate(30deg);
transform-origin: 50px 50px;

但是，要与跨浏览器兼容，您必须在SVG行中进行转换：

<line x1="50" x2="50" y1="50" y2="10" transform="rotate(30 50 50)" />

这是在点50,50周围旋转30度。希望有所帮助。