問題タブ [sketch-3]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
sketch-3 - スケッチで長方形からベクトル パスを差し引く方法
Sketchでベクトルパスをどのように減算しますか. 形状は簡単で、テキストも実行可能です。添付の画像の白い線は、長方形をカットする必要があります。提案？
html - さまざまなブラウザーでの奇妙なインライン SVG の不具合
Sketch を介して 4 つのインライン SVG のコードを同じストローク幅と色でエクスポートしましたが、1 つの SVG はブラウザ間および Codepen のブラウザ内で不規則に動作します。
- すべての SVG のストローク幅は「2」ですが、Twitter の SVG で同じ効果を得るには、ストローク幅を「4」にする必要があります (Chrome、Firefox、および Safari に適用されます)。
- すべての SVG は stroke="#999999" によって同じ色になります:
- 私のプロジェクトは Chrome と Firefox 経由で直接表示されます: Twitter の svg ストロークは正しい色です
Chrome と Firefox での Codepen の例: Twitter アイコンが著しく明るくなり、ストロークが #c2c2c2 のように表示される
Safari での個人的なプロジェクトと Codepen の例: Twitter の svg ストロークは、Codepen と私の個人的なプロジェクトの両方で #c2c2c2 としてレンダリングされます
ソリューション'...
twitter svgのrectタグのfill="#999999"をfill="#fff "に変更することで、svgがSafariで正常に表示されるようになりました。この「修正」なしで正しい色をレンダリングした Chrome と Firefox は影響を受けません。
この修正は、私のコードペンの例とソースから表示した場合に Safari で機能します。ただし、Chrome と Firefoxは、この修正が適用されているかどうかにかかわらず、codepen の例を正しくレンダリングしません。どちらも、Twitter の svg をソース、修正済み、または修正なしから正しくレンダリングします。
私のソリューションは今のところ機能しますが、なぜ機能するのかわかりません。どんな洞察も大歓迎です！