私は、鮮明なクロスブラウザSVGグラフィックスを作成するための信頼できるルールのセットを見つけようとしています。試行錯誤の末、私は次のことを思いつきました：http: //jsfiddle.net/WyYw6/2/
<p>C FF IE S</p>
<!-- x in Chrome -->
<svg width="15" height="15" overflow="hidden"><defs></defs><g><path d="M 4 4 L 11 11 M 11 4 L 4 11 Z" stroke="#000" stroke-width="1" fill="none" shape-rendering="crispEdges"></path></g></svg>
<!-- x in Firefox -->
<svg width="15" height="15" viewBox="-0.5 -0.5 15 15" overflow="hidden"><defs></defs><g><path d="M 4 4 L 11 11 M 11 4 L 4 11 Z" stroke="#000" stroke-width="1" fill="none" shape-rendering="crispEdges"></path></g></svg>
<!-- x in IE 9+ -->
<svg width="15" height="15" viewBox="0.5 0.5 15 15" overflow="hidden"><defs></defs><g><path d="M 4 4 L 11 11 M 11 4 L 4 11 Z" stroke="#000" stroke-width=".5" fill="none"></path></g></svg>
<!-- x in Desktop Safari -->
<svg width="15" height="15" overflow="hidden" viewBox="0.5 0.5 15 15"><defs></defs><g><path d="M 4 4 L 11 11 M 11 4 L 4 11 Z" stroke="#000" stroke-width="1" fill="none" shape-rendering="crispEdges"></path></g></svg>
<br>
<!-- square in Chrome -->
<svg width="15" height="15" overflow="hidden"><defs></defs><g><path d="M 1 1 M 11 1 L 11 11 L 1 11 L 1 1 Z" stroke="#000" stroke-width="1" fill="none" shape-rendering="crispEdges"></path></g></svg>
<!-- square in Firefox -->
<svg width="15" height="15" overflow="hidden" viewBox="-0.5 -0.5 15 15"><defs></defs><g><path d="M 1 1 M 11 1 L 11 11 L 1 11 L 1 1 Z" stroke="#000" stroke-width="1" fill="none" shape-rendering="crispEdges"></path></g></svg>
<!-- square in IE9+ -->
<svg width="15" height="15" overflow="hidden" viewBox="-0.5 0 15 15"><defs></defs><g><path d="M 1 1 M 11 1 L 11 11 L 1 11 L 1 1 Z" stroke="#000" stroke-width="1" fill="none"></path></g></svg>
<!-- square in Safari -->
<svg width="15" height="15" overflow="hidden"><defs></defs><g><path d="M 1 1 M 11 1 L 11 11 L 1 11 L 1 1 Z" stroke="#000" stroke-width="1" fill="none" shape-rendering="crispEdges"></path></g></svg>
クロスブラウザで機能する形状に単一のSVG記述を使用できるように、それを統合したいと思います。Chromeでの表示方法が一番気に入っています。それができない場合は、ブラウザー間で鮮明なSVGシェイプを作成するために、一貫した一連のルールに従う必要があります。また、IEでより良い結果を達成したいと思います。線幅を小さくすることにしました。そしてSafariでは、鮮明なxを取得する方法を理解できませんでした。