我嘗試了幾次，但我找不到將這個 < 轉換為 > 的點
<p style="text-align: right;">
<svg
class="uk-visible@m"
width="50"
height="100"
viewbox="5 5 13 13"
xmlns="http://www.w3.org/2000/svg"
>
<polyline
fill="none"
stroke="#ff6633"
stroke-width="1.6"
points="25,1 5.3,10 25,19"
></polyline>
</svg>
</p>有誰知道嗎？謝謝
uj5u.com熱心網友回復：
只是transform事情:)
<p style="text-align: right;">
<svg
class="uk-visible@m"
style="transform: rotate(180deg);"
width="50"
height="100"
viewbox="5 5 13 13"
xmlns="http://www.w3.org/2000/svg"
>
<polyline
fill="none"
stroke="#ff6633"
stroke-width="1.6"
points="25,1 5.3,10 25,19"
></polyline>
</svg>
</p>uj5u.com熱心網友回復：
只需將 180d 更改為 scaleX(-1)。
uj5u.com熱心網友回復：
鑒于您使用的 viewBox，折線的等效水平翻轉坐標為：
-2,1 17.7,10 -2,19
解釋：
- 水平地，您的 viewBox 跨度從 x = 5 到 x = 18 (5 13)。
- 要水平翻轉，您必須將 X 坐標從 viewBox 的一側翻轉到另一側。
- 第一個和最后一個 X 坐標是 25。即經過 viewBox (18) 右邊緣 7。所以要翻轉它，我們需要從viewBox的左邊緣減去 7 。這使得那些-2。
- 中間的 X 坐標是 5.3。即在 viewBox (5) 左邊緣內的 0.3。所以翻轉版本需要在右邊緣內為 0.3 。所以 18 - 0.3 變成 17.7。
于是25,1 5.3,10 25,19變成-2,1 17.7,10 -2,19。
<p style="text-align: right;"><svg class="uk-visible@m" width="50" height="100" viewbox="5 5 13 13" xmlns="http://www.w3.org/2000/svg"><polyline fill="none" stroke="#ff6633" stroke-width="1.6" points="-2,1 17.7,10 -2,19"></polyline></svg></p>轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/359355.html
上一篇：SVG顯示剪裁邊緣
下一篇：使用Css部分填充SVG圖示