Canvas Cursorのcssプロパティにuriを使用しますか？

Question

誰かがuriで動作するようにキャンバスのカーソルプロパティを取得できましたか？私はそれがこのURIで動作させることができません：

canvas { 
    cursor: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100pt%22%20height%3D%22100pt%22%20viewBox%3D%220 0 100 100%22%3E%3Cpath%20fill%3D%22%23000%22%20stroke%3D%22transparent%22%20stroke-width%3D%220%22%20style%3D%22%22%20d%3D%22M3.11 40.086c0-.438.054-.867.14-1.293-.055-.406-.14-.383-.14 1.293z M89.469 37.363c-1.563.988-12.547 7.71-13.797 6.875-.613-.414 1.922-3.93.805-5.438-1.578-2.128-1.184-5.003-1.973-7.417-.707-2.16-3.422-3.739-3.832-5.754-.355-1.73 2.02-2.672.687-4.477-1.53.941-3.062 1.887-4.593 2.832-.817-3.66.972-6.969-4.153-3.27-4.234 3.055-8.152 5.618-10.289 10.586-1.625 3.778-.855 9.61-5.175 11.184-4.54 1.657-9.243 3.38-13.547 5.582-3.176 1.63-6.075 5.782-9.72 6.204-4.023.464-5.124-8.32-5.515-10.906-.66-4.38-1.25-9.04-6.21-10.535-4.012-1.211-8.145 2.02-8.919 5.957.063.468.078 1.511-.14 1.293 1.773 1.785 5.03-5.508 6.96-1.41 2.325 4.937 1.805 11.27 2.88 16.542 1.59 7.848 5.117 20.117 13.823 22.727 2.2.66 5.422-1.004 5.2 2.2-.164 2.367-2.008 3.976.109 6.16 2.887 2.98 13.785 1.57 17.66 1.34 1.723-.102 10.637-.864 8.137-4.649-1.547-2.348-6.176-1.324-8.48-1.324 1.394-2.465 4.14-3.824 4.964-6.66 3.09 4.14 4.938 12.96 10.438 12.96 1.477 0 7.379.641 6.043-2.757-.77-1.95-2.586-1.313-3.832-2.602-6.629-6.836-5.352-25.246 5.023-27.78 6.2-1.52 13.176-6.102 17.203-11.028 2.239-2.738 8.184-6.37 8.895-10.03 1.148-5.833-8.29 3.367-8.652 3.597zm-16.812-1.582a.82.82 0 1 1 0-1.64.82.82 0 0 1 0 1.64z%22%2F%3E%3C%2Fsvg%3E") 
} 

は全くのURIで動作することが可能ですか、私は本当にこのためのリソースを要求する必要がありますか？

Answer 1

幅と高さはdefined in pixelsなければならない：

[...] SVG画像は、そのルートSVGノードの長さ値（ない百分率値）の高さと幅を含まなければなりません。 [...]

また、フォールバックイメージ、または "auto"または "pointer"の最小値を指定する必要があります。すべてのブラウザがSVGをソースとしてサポートするわけではありません。あなたはpxに（DPIに依存しています）pt単位を変更することができ、それはSVGをサポートしているブラウザで動作するはずです。この場合

：このため

div { 
 
    padding:30px; 
 
    cursor: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100px%22%20height%3D%22100px%22%20viewBox%3D%220 0 100 100%22%3E%3Cpath%20fill%3D%22%23000%22%20stroke%3D%22transparent%22%20stroke-width%3D%220%22%20style%3D%22%22%20d%3D%22M3.11 40.086c0-.438.054-.867.14-1.293-.055-.406-.14-.383-.14 1.293z M89.469 37.363c-1.563.988-12.547 7.71-13.797 6.875-.613-.414 1.922-3.93.805-5.438-1.578-2.128-1.184-5.003-1.973-7.417-.707-2.16-3.422-3.739-3.832-5.754-.355-1.73 2.02-2.672.687-4.477-1.53.941-3.062 1.887-4.593 2.832-.817-3.66.972-6.969-4.153-3.27-4.234 3.055-8.152 5.618-10.289 10.586-1.625 3.778-.855 9.61-5.175 11.184-4.54 1.657-9.243 3.38-13.547 5.582-3.176 1.63-6.075 5.782-9.72 6.204-4.023.464-5.124-8.32-5.515-10.906-.66-4.38-1.25-9.04-6.21-10.535-4.012-1.211-8.145 2.02-8.919 5.957.063.468.078 1.511-.14 1.293 1.773 1.785 5.03-5.508 6.96-1.41 2.325 4.937 1.805 11.27 2.88 16.542 1.59 7.848 5.117 20.117 13.823 22.727 2.2.66 5.422-1.004 5.2 2.2-.164 2.367-2.008 3.976.109 6.16 2.887 2.98 13.785 1.57 17.66 1.34 1.723-.102 10.637-.864 8.137-4.649-1.547-2.348-6.176-1.324-8.48-1.324 1.394-2.465 4.14-3.824 4.964-6.66 3.09 4.14 4.938 12.96 10.438 12.96 1.477 0 7.379.641 6.043-2.757-.77-1.95-2.586-1.313-3.832-2.602-6.629-6.836-5.352-25.246 5.023-27.78 6.2-1.52 13.176-6.102 17.203-11.028 2.239-2.738 8.184-6.37 8.895-10.03 1.148-5.833-8.29 3.367-8.652 3.597zm-16.812-1.582a.82.82 0 1 1 0-1.64.82.82 0 0 1 0 1.64z%22%2F%3E%3C%2Fsvg%3E") 122 40 
 
      , auto; /* Also remember a fallback */ 
 
    }

<div>Hover me</div>