SVGストロークのプロパティ
SVGストロークのプロパティ
SVGは、ストローク属性の広い範囲を提供しています。 この章では、次のようになります：
- ストローク
- ストローク幅
- 脳卒中このlinecap
- 脳卒中dasharray
すべてのストローク属性は、線、テキスト、および円形の輪郭などの要素の任意のタイプに適用することができます。
SVGストロークプロパティ
Stroke属性は線、またはテキスト要素のアウトラインの色を定義します。
ここではSVGのコードは次のとおりです。
例
<SVGののxmlns = "http://www.w3.org/2000/svg"バージョン= "1.1">
<G = "none"を埋めるありません>
<パスのストローク= "赤" D = "M5 20 L215 0" />
<パスのストローク= "青" D = "M5 40 L215 0" />
<パスのストローク= "黒" D = "M5 60 L215 0" />
</ G>
</ SVG>
<G = "none"を埋めるありません>
<パスのストローク= "赤" D = "M5 20 L215 0" />
<パスのストローク= "青" D = "M5 40 L215 0" />
<パスのストローク= "黒" D = "M5 60 L215 0" />
</ G>
</ SVG>
»をお試しください
オペラユーザーの場合： ビューSVGファイル （プレビューソースSVGグラフィック上で右クリックします）。
SVGストローク-width属性
Tstroke- width属性は、行、またはテキスト要素のアウトラインの太さを定義します。
ここではSVGのコードは次のとおりです。
例
<SVGののxmlns = "http://www.w3.org/2000/svg"バージョン= "1.1">
<G埋める= "なし"ストローク= "黒">
<パスのストローク幅= "2" D = "M5 20 L215 0" />
<パスのストローク幅= "4" D = "M5 40 L215 0" />
<パスのストローク幅= "6" D = "M5 60 L215 0" />
</ G>
</ SVG>
<G埋める= "なし"ストローク= "黒">
<パスのストローク幅= "2" D = "M5 20 L215 0" />
<パスのストローク幅= "4" D = "M5 40 L215 0" />
<パスのストローク幅= "6" D = "M5 60 L215 0" />
</ G>
</ SVG>
»をお試しください
オペラユーザーの場合： ビューSVGファイル （プレビューソースSVGグラフィック上で右クリックします）。
SVGストローク-このlinecapプロパティ
strokelinecap属性は、異なる種類のオープンパスの終点を定義します。
ここではSVGのコードは次のとおりです。
例
<SVGののxmlns = "http://www.w3.org/2000/svg"バージョン= "1.1">
<G埋める= "なし"ストローク= "黒"ストローク幅= "6">
<パスのストローク-このlinecap = "お尻" D = "M5 20 L215 0" />
<パスのストローク-このlinecap = "ラウンド" D = "M5 40 L215 0" />
<パスのストローク-このlinecap = "四角" D = "M5 60 L215 0" />
</ G>
</ SVG>
<G埋める= "なし"ストローク= "黒"ストローク幅= "6">
<パスのストローク-このlinecap = "お尻" D = "M5 20 L215 0" />
<パスのストローク-このlinecap = "ラウンド" D = "M5 40 L215 0" />
<パスのストローク-このlinecap = "四角" D = "M5 60 L215 0" />
</ G>
</ SVG>
»をお試しください
オペラユーザーの場合： ビューSVGファイル （プレビューソースSVGグラフィック上で右クリックします）。
SVGストロークdasharrayプロパティ
点線を作成するために使用されるプロパティをstrokedasharray：
ここではSVGのコードは次のとおりです。
例
<SVGののxmlns = "http://www.w3.org/2000/svg"バージョン= "1.1">
<G埋める= "なし"ストローク= "黒"ストローク幅= "4">
<パスのストロークdasharray = "5,5" D = "M5 20 L215 0" />
<パスのストロークdasharray = "10,10" D = "M5 40 L215 0" />
<パスのストロークdasharray = "20,10,5,5,5,10" D = "M5 60 L215 0" />
</ G>
</ SVG>
<G埋める= "なし"ストローク= "黒"ストローク幅= "4">
<パスのストロークdasharray = "5,5" D = "M5 20 L215 0" />
<パスのストロークdasharray = "10,10" D = "M5 40 L215 0" />
<パスのストロークdasharray = "20,10,5,5,5,10" D = "M5 60 L215 0" />
</ G>
</ SVG>
»をお試しください
オペラユーザーの場合： ビューSVGファイル （プレビューソースSVGグラフィック上で右クリックします）。