SVG significa Gráfico vectorial escalable. Se puede usar para hacer gráficos y animaciones como en el lienzo HTML.
El elemento SVG <use> toma Nodes del documento SVG y los duplica en otro lugar.
Sintaxis:
<use href="" >
Subtext
</use>
Atributo:
- x: el eje x coordina el posicionamiento de la imagen.
- y: el eje y coordina el posicionamiento de la imagen.
- ancho: Ancho de la imagen.
- altura: Altura de la imagen.
- href: La fuente de la imagen.
- Atributos globales: algunos atributos globales utilizados como atributos principales y atributos de estilo, etc.
Ejemplo 1:
html
<!DOCTYPE html> <html> <body> <svg width="400" height="200" xmlns="http://www.w3.org/2000/svg"> <circle id="gfg" cx="100" cy="100" r="40" fill="green"/> <use href="#gfg" x="110"></use> </svg> </body> </html>
Producción:
Ejemplo 2:
html
<!DOCTYPE html> <html> <body> <svg width="400" height="200" xmlns="http://www.w3.org/2000/svg"> <a href="https://ide.geeksforgeeks.org" id="gfg"> <text x="50" y="90" text-anchor="middle"> Click Here </text> </a> <use href="#gfg" y="110"></use> </svg> </body> </html>
Producción:
Navegadores compatibles:
- Chrome 22 y superior
- Borde 12 y superior
- Firefox 4 y superior
- Safari 3 y superior
- explorador de Internet
- Ópera 11.5 y superior