initial commit

1 files changed, 118 insertions, 0 deletions

diff --git a/files/zh-cn/web/svg/attribute/rx/index.html b/files/zh-cn/web/svg/attribute/rx/index.html
new file mode 100644
index 0000000000..4ae7b0203a
--- /dev/null
+++ b/files/zh-cn/web/svg/attribute/rx/index.html
@@ -0,0 +1,118 @@
+---
+title: rx
+slug: Web/SVG/Attribute/rx
+tags:
+  - SVG
+  - SVG属性
+translation_of: Web/SVG/Attribute/rx
+---
+<div>{{SVGRef}}</div>
+
+<p><strong><code>rx</code></strong> 属性用于定义水平轴向的圆角半径尺寸。</p>
+
+<p>{{SVGElement("ellipse")}} 和 {{SVGElement("rect")}} 两个基本图形使用了这个属性。</p>
+
+<div id="topExample">
+<div class="hidden"> </div>
+</div>
+
+<div id="topExample">
+<div class="hidden">
+<pre class="brush: css">html,body,svg { height:100% }</pre>
+</div>
+
+<pre class="brush: html">&lt;svg viewBox="0 0 300 200" xmlns="http://www.w3.org/2000/svg"&gt;
+  &lt;ellipse cx="50"  cy="50" rx="0"  ry="25" /&gt;
+  &lt;ellipse cx="150" cy="50" rx="25" ry="25" /&gt;
+  &lt;ellipse cx="250" cy="50" rx="50" ry="25" /&gt;
+
+  &lt;rect x="20"  y="120" width="60" height="60" rx="0"   ry="15"/&gt;
+  &lt;rect x="120" y="120" width="60" height="60" rx="15"  ry="15"/&gt;
+  &lt;rect x="220" y="120" width="60" height="60" rx="150" ry="15"/&gt;
+&lt;/svg&gt;</pre>
+
+<p>{{EmbedLiveSample('topExample', '100%', 200)}}</p>
+</div>
+
+<h2 id="椭圆">椭圆</h2>
+
+<p>对于 {{SVGElement('ellipse')}}，<code>rx</code> 属性定义了水平方向的半径尺寸。如果使用了负值或者零，那么椭圆就不会被绘制。</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">取值</th>
+   <td><strong><a href="/docs/Web/SVG/Content_type#Length">&lt;length&gt;</a></strong> | <strong><a href="/docs/Web/SVG/Content_type#Percentage">&lt;percentage&gt;</a></strong> | <code>auto</code></td>
+  </tr>
+  <tr>
+   <th scope="row">默认值</th>
+   <td><code>auto</code></td>
+  </tr>
+  <tr>
+   <th scope="row">是否支持动画</th>
+   <td>是</td>
+  </tr>
+ </tbody>
+</table>
+
+<p class="note"><strong>注释:</strong> 从 SVG2 开始， <code>rx</code> 是一个几何属性，也就是说，这个属性也可以用作椭圆的CSS属性。</p>
+
+<h2 id="矩形">矩形</h2>
+
+<p>对于 {{SVGElement('rect')}}，<code>rx</code> 定义了水平方向的圆角尺寸。</p>
+
+<p><code>rx</code> 属性的实际效果取决于矩形的 {{SVGAttr("ry")}} 属性和宽度：</p>
+
+<ul>
+ <li>如果你为 <code>rx</code> 属性指定了正确的值，但是没有定义 {{SVGAttr("ry")}} 属性的值，那么浏览器会让 {{SVGAttr("ry")}} 取 <code>rx</code> 属性被指定的相等的值。（反之亦然）</li>
+ <li>如果 <code>rx</code> 和 {{SVGAttr("ry")}} 都没有被正确的赋值，那么浏览器会绘制一个带有直角尖角的矩形。</li>
+ <li><code>rx</code> 属性的有效值为矩形宽度的一半（即，如果为 <code>rx</code> 指定的值大于矩形宽度的一半，那么浏览器会视为 <code>rx</code> 的值为矩形宽度的一半）。</li>
+</ul>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">取值</th>
+   <td><strong><a href="/docs/Web/SVG/Content_type#Length">&lt;length&gt;</a></strong> | <strong><a href="/docs/Web/SVG/Content_type#Percentage">&lt;percentage&gt;</a></strong> | <code>auto</code></td>
+  </tr>
+  <tr>
+   <th scope="row">缺省值</th>
+   <td><code>auto</code></td>
+  </tr>
+  <tr>
+   <th scope="row">是否支持动画</th>
+   <td>是</td>
+  </tr>
+ </tbody>
+</table>
+
+<p class="note"><strong>注释:</strong> 从 SVG2 开始，<code>rx</code> 是一个几何属性，也就是说，这个属性也可以用作矩形（rect）的 CSS 属性。</p>
+
+<h2 id="Specifications">Specifications</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", "geometry.html#RX", "rx")}}</td>
+   <td>{{Spec2("SVG2")}}</td>
+   <td>被定义为几何属性</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("SVG1.1", "shapes.html#EllipseElementRXAttribute", "rx")}}</td>
+   <td>{{Spec2("SVG1.1")}}</td>
+   <td><code>&lt;ellipse&gt;</code> 的初始定义</td>
+  </tr>
+  <tr>
+   <td> {{SpecName("SVG1.1", "shapes.html#RectElementRXAttribute", "rx")}}</td>
+   <td>{{Spec2("SVG1.1")}}</td>
+   <td><code>&lt;rect&gt;</code> 的初始定义</td>
+  </tr>
+ </tbody>
+</table>