SVG (Scalable Vector Graphics) では、 <stroke>プロパティは形状の輪郭を定義するために使用されます。これは、ストロークの色、幅、スタイルを指定するために、 <path> 、 <rect> 、 <circle> 、およびその他の SVG 要素と組み合わせてよく使用されます。 SVG でストローク プロパティを使用する方法をいくつか示します。

1. 基本的なストローク:ストローク プロパティの最も基本的な使用法は、ストロークの色を定義することです。 stroke属性を使用して色を設定できます。例えば：

    XML
    <circle cx="50" cy="50" r="40" stroke="black" />
   

   この例では、 <circle>の要素に黒いストロークが表示されます。

2. ストロークの幅: stroke-width属性を使用してストロークの幅を設定できます。例えば：

    XML
    <rect x="10" y="10" width="80" height="80" stroke="blue" stroke-width="3" />
   

   この長方形には、幅 3 単位の青いストロークが表示されます。

3. ストロークの不透明度: stroke-opacityアトリビュートを使用してストロークの不透明度を制御できます。 0 (完全に透明) と 1 (完全に不透明) の間の値を取ります。例えば：

    XML
    <line x1="10" y1="10" x2="90" y2="90" stroke="red" stroke-width="2" stroke-opacity="0.7" />
   

   この線には、不透明度 70% の赤いストロークが表示されます。

4. Stroke Dasharray: stroke-dasharray属性を使用すると、破線または点線のストロークを作成できます。一連の値を指定して、ダッシュとギャップの長さを制御できます。例えば：

    XML
    <line x1="10" y1="50" x2="90" y2="50" stroke="green" stroke-width="2" stroke-dasharray="5,3" />
   

   この線は、長さ 5 のダッシュと長さ 3 のギャップを持つ緑色の破線のストロークになります。

5. ストローク ラインキャップ: stroke-linecap属性は、ストロークの端点の描画に使用される形状を定義します。 butt 、 round 、またはsquareのような値を取ることができます。例えば：

    XML
    <line x1="20" y1="20" x2="80" y2="80" stroke="purple" stroke-width="5" stroke-linecap="round" />
   

   この線は、丸い線のキャップが付いた紫色のストロークになります。

これらは、SVG でストローク プロパティを使用する方法のほんの数例です。これらのプロパティと値を試して、SVG グラフィックスのストロークに必要な視覚効果を実現します。