Esta traducción está incompleta. Por favor, ayuda a traducir este artículo del inglés.
El elemento text define un elemento gráfico que consiste en texto. Nótese que es posible aplicar un degradado, patrón, recorte, máscara o filtro al texto
Uso
| Categorias | Elemento gráfico, Elemento de contenido de texto |
|---|---|
| Contenido permitido | Datos de caracteres y cualquier cantidad de los siguientes elementos en cualquier órden: Elementos de animación Elementos descriptivos Elementos de contenido de texto <a> |
Ejemplo
<?xml version="1.0"?>
<svg xmlns="http://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>
El elemento <text> es usado para dibujar texto. El siguiente código de ejemplo es usado para dibujar texto con coordenadas.
<svg xmlns="http://www.w3.org/2000/svg" width="100px" height="50px"> <text x="10" y="20">SVG Text Example</text> </svg>
El elemento text puede ser rotado. El siguiente código de ejemplo muestra cómo.
<svg xmlns="http://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>
SVG text también puede ser estilizado
<svg xmlns="http://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 globales
- Atributos de procesamiento condicional »
- Atributos base »
- Atributos de eventos gráficos »
- Atributos de presentación »
classstyleexternalResourcesRequiredtransform
Atributos específicos
Interfaz DOM
Este elemento hereda la interfaz de SVGTextElement.
Compatibilidad con navegadores
We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!
| Feature | Chrome | Firefox (Gecko) | IE | Opera | Safari |
|---|---|---|---|---|---|
| Basic support | 1.0 | 1.5 (1.8) | 9.0 | 8.0 | 3.0.4 |
| Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | 3.0 | 1.0 (1.8) | Sin soporte | (Yes) | 3.0.4 |
La gráfica está basada en estas fuentes.