El elemento SVG <text> se utiliza para dibujar texto. Hay algunos atributos para personalizar el texto.
Sintaxis:
<text x="x-coordinates" y="y-coordinates" dx="list of lengths" dy="list of lengths" rotate="list of numbers" textlength="length" lengthAdjust="spacing" > </text>
Atributo:
- x: coordenadas del eje x de los glifos.
- y: coordenadas del eje y de los glifos.
- dx: desplazamiento a lo largo del eje x.
- dy: desplazamiento a lo largo del eje y.
- rotar: rotación de glifos.
- textlength: representa la longitud del texto.
- lengthAdjust: ajustes con la longitud renderizada.
Ejemplo:
html
<html> <title>SVG Text</title> <body> <svg width="400" height="400"> <text x="40" y="40" fill="green"> GeeksforGeeks </text> </svg> </body> </html>
Producción:
Ejemplo: texto de varias líneas girado.
html
<html> <title>SVG Text</title> <body> <svg width="400" height="400"> <text x="10" y="10" fill="green" transform="rotate(30 20, 40)"> GeeksforGeeks</text> <text x="40" y="40" fill="green" transform="rotate(90 10, 60)"> GeeksforGeeks</text> </svg> </body> </html>
Producción:
Publicación traducida automáticamente
Artículo escrito por Vijay Sirra y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA