aboutsummaryrefslogtreecommitdiff
path: root/files/ru/web/svg/attribute/r
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:52 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:52 -0500
commit074785cea106179cb3305637055ab0a009ca74f2 (patch)
treee6ae371cccd642aa2b67f39752a2cdf1fd4eb040 /files/ru/web/svg/attribute/r
parentda78a9e329e272dedb2400b79a3bdeebff387d47 (diff)
downloadtranslated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.gz
translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.bz2
translated-content-074785cea106179cb3305637055ab0a009ca74f2.zip
initial commit
Diffstat (limited to 'files/ru/web/svg/attribute/r')
-rw-r--r--files/ru/web/svg/attribute/r/index.html129
1 files changed, 129 insertions, 0 deletions
diff --git a/files/ru/web/svg/attribute/r/index.html b/files/ru/web/svg/attribute/r/index.html
new file mode 100644
index 0000000000..1f92d75024
--- /dev/null
+++ b/files/ru/web/svg/attribute/r/index.html
@@ -0,0 +1,129 @@
+---
+title: r
+slug: Web/SVG/Attribute/r
+translation_of: Web/SVG/Attribute/r
+---
+<div>{{SVGRef}}</div>
+
+<div>Атрибут r устанавливает значение радиуса круга.</div>
+
+<div> </div>
+
+<p>Этот атрибут используют два элемента: {{SVGElement("circle")}}, и {{SVGElement("radialGradient")}}</p>
+
+<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;radialGradient r="0" id="myGradient000"&gt;
+    &lt;stop offset="0"    stop-color="white" /&gt;
+    &lt;stop offset="100%" stop-color="black" /&gt;
+  &lt;/radialGradient&gt;
+  &lt;radialGradient r="50%" id="myGradient050"&gt;
+    &lt;stop offset="0"    stop-color="white" /&gt;
+    &lt;stop offset="100%" stop-color="black" /&gt;
+  &lt;/radialGradient&gt;
+  &lt;radialGradient r="100%" id="myGradient100"&gt;
+    &lt;stop offset="0"    stop-color="white" /&gt;
+    &lt;stop offset="100%" stop-color="black" /&gt;
+  &lt;/radialGradient&gt;
+
+  &lt;circle cx="50"  cy="50" r="0"/&gt;
+  &lt;circle cx="150" cy="50" r="25"/&gt;
+  &lt;circle cx="250" cy="50" r="50"/&gt;
+
+  &lt;rect x="20"  y="120" width="60" height="60" fill="url(#myGradient000)" /&gt;
+  &lt;rect x="120" y="120" width="60" height="60" fill="url(#myGradient050)" /&gt;
+  &lt;rect x="220" y="120" width="60" height="60" fill="url(#myGradient100)" /&gt;
+&lt;/svg&gt;</pre>
+
+<p>{{EmbedLiveSample('topExample', '100%', 200)}}</p>
+</div>
+
+<h2 id="circle">circle</h2>
+
+<p>Для {{SVGElement('circle')}}, <code>r</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></td>
+ </tr>
+ <tr>
+ <th scope="row">
+ <p dir="ltr">Значение по умолчанию</p>
+ </th>
+ <td><code>0</code></td>
+ </tr>
+ <tr>
+ <th scope="row">Анимируемость</th>
+ <td>Да</td>
+ </tr>
+ </tbody>
+</table>
+
+<p class="note"><strong>Примечание:</strong> Начиная с SVG2, <strong>r</strong> является свойством геометрии, означающим, что этот атрибут также может использоваться как CSS-свойство для кругов.</p>
+
+<h2 id="radialGradient">radialGradient</h2>
+
+<p>Для {{ SVGElement("radialGradient") }}, <code>r</code> устанавливает радиус конечной окружности радиального градиента.</p>
+
+<p>Градиент будет нарисован таким образом, чтобы  <strong>100%</strong> конца градиента отображались по периметру этого конечного круга. Значение, меньшее или равное нулю, приведет к тому, что область будет окрашена как один цвет, используя цвет и непрозрачность последнего градиента  {{ SVGElement("stop") }}.</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></td>
+ </tr>
+ <tr>
+ <th scope="row">Значение по умолчанию</th>
+ <td><code>50%</code></td>
+ </tr>
+ <tr>
+ <th scope="row">Анимируемость</th>
+ <td>Да</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Спецификации">Спецификации</h2>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Спецификация</th>
+ <th scope="col">Статус</th>
+ <th scope="col">Комментарий</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>{{SpecName("SVG2", "geometry.html#R", "r")}}</td>
+ <td>{{Spec2("SVG2")}}</td>
+ <td>
+ <p dir="ltr" id="tw-target-text">Определение как свойство геометрии</p>
+
+ <p> </p>
+ </td>
+ </tr>
+ <tr>
+ <td>{{SpecName("SVG2", "pservers.html#RadialGradientElementRAttribute", "r")}}</td>
+ <td>{{Spec2("SVG2")}}</td>
+ <td>Определение для SVG2 серверов рисования <code>&lt;radialGradient&gt;</code></td>
+ </tr>
+ <tr>
+ <td>{{SpecName("SVG1.1", "pservers.html#RadialGradientElementRAttribute", "r")}}</td>
+ <td>{{Spec2("SVG1.1")}}</td>
+ <td>Исходное определение для <code>&lt;radialGradient&gt;</code></td>
+ </tr>
+ <tr>
+ <td>{{SpecName("SVG1.1", "shapes.html#CircleElementRAttribute", "r")}}</td>
+ <td>{{Spec2("SVG1.1")}}</td>
+ <td>Исходное определение для <code>&lt;circle&gt;</code></td>
+ </tr>
+ </tbody>
+</table>