爲什麼Safari會翻轉我的SVG背景圖案？

Question

我有一個SVG文件看起來像這樣

<?xml version="1.0" encoding="utf-8"?> 
<svg version="1.1" 
xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"> 
<defs> 
<pattern id="pat" patternUnits="userSpaceOnUse" width="3px" height="3px"> 
    <rect y="2" width="1" height="1" fill-opacity="0.2" /> 
    <rect x="1" y="1" width="1" height="1" fill-opacity="0.2"/> 
    <rect x="2" width="1" height="1" fill-opacity="0.2"/> 
</pattern> 
</defs> 
<rect fill="url(#pat)" height="148" width="259" y="106" x="109" stroke="#000000" /> 
</svg> 

在Chrome和Firefox它看起來像這樣的預期：

現在在Safari（5.1.3）我看到這一點：

請注意，這裏的線條是相反的。這是因爲Safari似乎垂直翻轉了我爲填充定義的任何圖案。

我錯過了什麼嗎？這是一個錯誤？

Answer 1

這是一個錯誤。請參閱：https://bugs.webkit.org/show_bug.cgi?id=75741

在Safari（Mac）上，應該使用V5.1.5修復它。在移動Safari上它似乎沒有修復。

嘗試用戶代理嗅探* + <pattern patternTransform="scale(1,-1)" …>。

*）特徵檢測總是比UA嗅探好，但我不知道如何檢測這個錯誤。