Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

text

O elemento text define um elemento gráfico consistido de texto. Note que é possível aplicar gradientes, padrões, caminhos de recorte, máscara ou filtro para texto.

Contexto de uso

CategoriasElemento gráfico, Elemento de conteúdo textual
Conteúdo permitidoDados de caracteres e qualquer número dos seguintes elementos, em qualquer ordem:
Elementos de animação
Elementos descritivos
Elementos de conteúdo textual
<a>

Exemplo

<?xml version="1.0"?>
<svg xmlns="https://www.w3.org/2000/svg"
     width="100px" height="30px" viewBox="0 0 1000 300">

  <text x="250" y="150" 
        font-family="Verdana" 
        font-size="55">
    Hello, out there
  </text>

  <!-- Show outline of canvas using 'rect' element -->
  <rect x="1" y="1" width="998" height="298"
        fill="none" stroke-width="2" />
</svg>

O elemento <text> é utilizado para desenhar texto. O seguinte exemplo de código é utilizado para desenhar texto com coordenadas:

<svg xmlns="https://www.w3.org/2000/svg" width="100px" height="50px">
  <text x="10" y="20">SVG Text Example</text>
</svg>

Textos em SVG podem ser rotacionados. O código a seguir exemplifica isso.

<svg xmlns="https://www.w3.org/2000/svg" width="100px" height="50px">
  <text x="10"  y="20" 
        transform="rotate(30 20,40)">
    SVG Text Rotation example
  </text>
</svg>

Textos em SVG também podem ser estilizados

<svg xmlns="https://www.w3.org/2000/svg" width="100px" height="50px">
  <text x="10"  y="20"
        style="font-family: Times New Roman;
               font-size  : 24;
               stroke     : #00ff00;
               fill       : #0000ff;">
    SVG text styling
  </text>
</svg>

Atributos

Atributos globais

Atributos específicos

DOM Interface

Este elemento implementa a interface do SVGTextElement.

Compatibilidade dos navegadores

Recurso Chrome Firefox (Gecko) IE Opera Safari
Suporte básico 1.0 1.5 (1.8) 9.0 8.0 3.0.4
Recurso Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Suporte básico 3.0 1.0 (1.8) Não suportado (Yes) 3.0.4

A tabela é baseada nessas fontes.

Relacionado

Etiquetas do documento e colaboradores

 Colaboradores desta página: Sebastianz, teoli, caio, unreleasedmix
 Última atualização por: Sebastianz,