From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001
From: Peter Bengtsson <mail@peterbe.com>
Date: Tue, 8 Dec 2020 14:42:52 -0500
Subject: initial commit

---
 files/pt-br/web/svg/attribute/class/index.html | 195 +++++++++++++++++++++++++
 1 file changed, 195 insertions(+)
 create mode 100644 files/pt-br/web/svg/attribute/class/index.html

(limited to 'files/pt-br/web/svg/attribute/class')

diff --git a/files/pt-br/web/svg/attribute/class/index.html b/files/pt-br/web/svg/attribute/class/index.html
new file mode 100644
index 0000000000..55fd46c6a0
--- /dev/null
+++ b/files/pt-br/web/svg/attribute/class/index.html
@@ -0,0 +1,195 @@
+---
+title: class
+slug: Web/SVG/Attribute/class
+tags:
+  - Atributos SVG
+  - Classe
+  - Referencia
+  - SVG
+translation_of: Web/SVG/Attribute/class
+---
+<p>« <a href="/en/SVG/Attribute" title="en/SVG/Attribute">Página inicial da referência de atributos do SVG</a></p>
+
+<p>Atribui um nome de classe ou um conjunto de nomes de classe a um elemento. Você pode atribuir o mesmo nome ou nomes de classe para qualquer número de elementos. Se você especificar vários nomes de classe, estes devem ser separados por caracteres de espaço em branco.</p>
+
+<p>O nome de classe de um elemento tem duas funções principais:</p>
+
+<ul>
+ <li>Como um seletor de folha de estilo, para a utilização quando um autor quiser atribuir informações de estilo a um conjunto de elementos.</li>
+ <li>Para utilizações gerais do navegador.</li>
+</ul>
+
+<p>A classe pode ser utilizada pra estilizar o conteúdo do SVG com CSS.</p>
+
+<h2 id="Utilização">Utilização</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Categorias</th>
+   <td>Nenhuma</td>
+  </tr>
+  <tr>
+   <th scope="row">Valor</th>
+   <td><a href="/en/SVG/Content_type#List-of-Ts" title="en/SVG/Content type#List-of-Ts">&lt;list-of-class-names&gt;</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Animável</th>
+   <td>Sim</td>
+  </tr>
+  <tr>
+   <th scope="row">Documento normativo</th>
+   <td><a class="external" href="http://www.w3.org/TR/SVG/styling.html#ClassAttribute" title="http://www.w3.org/TR/SVG/styling.html#ClassAttribute">SVG 1.1 (2ª Edição): O atributo class</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>{{ page("/pt-BR/SVG/Content_type","List-of-Ts") }}</p>
+
+<h2 id="Exemplo">Exemplo</h2>
+
+<pre class="brush: html">&lt;html&gt;
+    &lt;body&gt;
+  &lt;svg width="120" height="220"
+     viewPort="0 0 120 120" version="1.1"
+     xmlns="http://www.w3.org/2000/svg"&gt;
+
+    &lt;style type="text/css" &gt;
+      &lt;![CDATA[
+
+        rect.rectClass {
+           stroke: #000066;
+           fill:   #00cc00;
+        }
+       circle.circleClass {
+       stroke: #006600;
+       fill:   #cc0000;
+    }
+
+      ]]&gt;
+    &lt;/style&gt;
+
+      &lt;rect class="rectClass" x="10" y="10" width="100" height="100"/&gt;
+     &lt;circle  class="circleClass"   cx="40" cy="50" r="26"/&gt;
+&lt;/svg&gt;
+&lt;/body&gt;&lt;/html&gt;</pre>
+
+<h2 id="Elementos">Elementos</h2>
+
+<p>Os seguintes elementos podem utilizar o atributo <code>class</code>:</p>
+
+<div class="threecolumns">
+<ul>
+ <li>{{ SVGElement("a") }}</li>
+ <li>{{ SVGElement("altGlyph") }}</li>
+ <li>{{ SVGElement("circle") }}</li>
+ <li>{{ SVGElement("clipPath") }}</li>
+ <li>{{ SVGElement("defs") }}</li>
+ <li>{{ SVGElement("desc") }}</li>
+ <li>{{ SVGElement("ellipse") }}</li>
+ <li>{{ SVGElement("feBlend") }}</li>
+ <li>{{ SVGElement("feColorMatrix") }}</li>
+ <li>{{ SVGElement("feComponentTransfer") }}</li>
+ <li>{{ SVGElement("feComposite") }}</li>
+ <li>{{ SVGElement("feConvolveMatrix") }}</li>
+ <li>{{ SVGElement("feDiffuseLighting") }}</li>
+ <li>{{ SVGElement("feDisplacementMap") }}</li>
+ <li>{{ SVGElement("feFlood") }}</li>
+ <li>{{ SVGElement("feGaussianBlur") }}</li>
+ <li>{{ SVGElement("feImage") }}</li>
+ <li>{{ SVGElement("feMerge") }}</li>
+ <li>{{ SVGElement("feMorphology") }}</li>
+ <li>{{ SVGElement("feOffset") }}</li>
+ <li>{{ SVGElement("feSpecularLighting") }}</li>
+ <li>{{ SVGElement("feTile") }}</li>
+ <li>{{ SVGElement("feTurbulence") }}</li>
+ <li>{{ SVGElement("filter") }}</li>
+ <li>{{ SVGElement("font") }}</li>
+ <li>{{ SVGElement("foreignObject") }}</li>
+ <li>{{ SVGElement("g") }}</li>
+ <li>{{ SVGElement("glyph") }}</li>
+ <li>{{ SVGElement("glyphRef") }}</li>
+ <li>{{ SVGElement("image") }}</li>
+ <li>{{ SVGElement("line") }}</li>
+ <li>{{ SVGElement("linearGradient") }}</li>
+ <li>{{ SVGElement("marker") }}</li>
+ <li>{{ SVGElement("mask") }}</li>
+ <li>{{ SVGElement("missing-glyph") }}</li>
+ <li>{{ SVGElement("path") }}</li>
+ <li>{{ SVGElement("pattern") }}</li>
+ <li>{{ SVGElement("polygon") }}</li>
+ <li>{{ SVGElement("polyline") }}</li>
+ <li>{{ SVGElement("radialGradient") }}</li>
+ <li>{{ SVGElement("rect") }}</li>
+ <li>{{ SVGElement("stop") }}</li>
+ <li>{{ SVGElement("svg") }}</li>
+ <li>{{ SVGElement("switch") }}</li>
+ <li>{{ SVGElement("symbol") }}</li>
+ <li>{{ SVGElement("text") }}</li>
+ <li>{{ SVGElement("textPath") }}</li>
+ <li>{{ SVGElement("title") }}</li>
+ <li>{{ SVGElement("tref") }}</li>
+ <li>{{ SVGElement("tspan") }}</li>
+ <li>{{ SVGElement("use") }}</li>
+</ul>
+</div>
+
+<h2 id="Compatibilidade_dos_navegadores">Compatibilidade dos navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Recurso</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Suporte básico</td>
+   <td>(yes)</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>Suporte à animação</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("5") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Recurso</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Suporte básico</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
-- 
cgit v1.2.3-54-g00ecf