initial commit

1 files changed, 117 insertions, 0 deletions

diff --git a/files/ja/web/svg/attribute/stroke-dasharray/index.html b/files/ja/web/svg/attribute/stroke-dasharray/index.html
new file mode 100644
index 0000000000..e83a7e18f9
--- /dev/null
+++ b/files/ja/web/svg/attribute/stroke-dasharray/index.html
@@ -0,0 +1,117 @@
+---
+title: stroke-dasharray
+slug: Web/SVG/Attribute/stroke-dasharray
+translation_of: Web/SVG/Attribute/stroke-dasharray
+---
+<div>{{SVGRef}}</div>
+
+<p><strong><code>stroke-dasharray</code></strong>属性は、 輪郭を描くために使用される、破線や間隔のある線のパターンを定義するプレゼンテーション属性です。</p>
+
+<p class="note"><strong>Note:</strong> プレゼンテーション属性として、<strong><code>stroke-dasharray</code></strong>属性は、CSSプロパティとして使用することができます。</p>
+
+<p>プレゼンテーション属性として、それはいくつかの要素に適用することができますが、つぎの12個の要素にのみ効果があります。</p>
+
+<div class="threecolumns">
+<ul>
+ <li>{{SVGElement('altGlyph')}}</li>
+ <li>{{SVGElement('circle')}}</li>
+ <li>{{SVGElement('ellipse')}}</li>
+ <li>{{SVGElement('path')}}</li>
+ <li>{{SVGElement('line')}}</li>
+ <li>{{SVGElement('polygon')}}</li>
+ <li>{{SVGElement('polyline')}}</li>
+ <li>{{SVGElement('rect')}}</li>
+ <li>{{SVGElement('text')}}</li>
+ <li>{{SVGElement('textPath')}}</li>
+ <li>{{SVGElement('tref')}}</li>
+ <li>{{SVGElement('tspan')}}</li>
+</ul>
+</div>
+
+<div id="topExample">
+<div class="hidden">
+<pre class="brush: css notranslate">html,body,svg { height:100% }</pre>
+</div>
+
+<pre class="brush: html notranslate">&lt;svg viewBox="0 0 30 10" xmlns="http://www.w3.org/2000/svg"&gt;
+  &lt;!-- No dashes nor gaps --&gt;
+  &lt;line x1="0" y1="1" x2="30" y2="1" stroke="black" /&gt;
+
+  &lt;!-- Dashes and gaps of the same size --&gt;
+  &lt;line x1="0" y1="3" x2="30" y2="3" stroke="black"
+          stroke-dasharray="4" /&gt;
+
+  &lt;!-- Dashes and gaps of different sizes --&gt;
+  &lt;line x1="0" y1="5" x2="30" y2="5" stroke="black"
+          stroke-dasharray="4 1" /&gt;
+
+  &lt;!-- Dashes and gaps of various sizes with an odd number of values --&gt;
+  &lt;line x1="0" y1="7" x2="30" y2="7" stroke="black"
+          stroke-dasharray="4 1 2" /&gt;
+
+  &lt;!-- Dashes and gaps of various sizes with an even number of values --&gt;
+  &lt;line x1="0" y1="9" x2="30" y2="9" stroke="black"
+          stroke-dasharray="4 1 2 3" /&gt;
+&lt;/svg&gt;
+</pre>
+
+<p>{{EmbedLiveSample('topExample', '100%', 150)}}</p>
+</div>
+
+<h2 id="Usage_notes">Usage notes</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Value</th>
+   <td><code>none</code> | <var>&lt;dasharray&gt;</var></td>
+  </tr>
+  <tr>
+   <th scope="row">Default value</th>
+   <td><code>none</code></td>
+  </tr>
+  <tr>
+   <th scope="row">Animatable</th>
+   <td>Yes</td>
+  </tr>
+ </tbody>
+</table>
+
+<dl>
+ <dt><var>&lt;dasharray&gt;</var></dt>
+ <dd>
+ <p>A list of comma and/or white space separated <a href="/en/SVG/Content_type#Length" title="en/SVG/Content_type#Length"><var>&lt;length&gt;</var></a>s and <a href="/en/SVG/Content_type#Percentage" title="en/SVG/Content_type#Percentage"><var>&lt;percentage&gt;</var></a>s that specify the lengths of alternating dashes and gaps.</p>
+
+ <p>If an odd number of values is provided, then the list of values is repeated to yield an even number of values. Thus, <code>5,3,2</code> is equivalent to <code>5,3,2,5,3,2</code>.</p>
+ </dd>
+</dl>
+
+<h2 id="Browser_Compatibility" name="Browser_Compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("svg.attributes.presentation.stroke-dasharray")}}</p>
+
+<h2 id="Specification">Specification</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("SVG2", "painting.html#StrokeDasharrayProperty", "stroke-dasharray")}}</td>
+   <td>{{Spec2("SVG2")}}</td>
+   <td>Definition for shapes and texts</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("SVG1.1", "painting.html#StrokeDasharrayProperty", "stroke-dasharray")}}</td>
+   <td>{{Spec2("SVG1.1")}}</td>
+   <td>Initial definition for shapes and texts</td>
+  </tr>
+ </tbody>
+</table>