SVG significa Gráfico vectorial escalable. Se puede usar para hacer gráficos y animaciones como en el lienzo HTML.
El elemento <foreignObject> de SVG incluye elementos de un espacio de nombres XML diferente. Es un punto de extensibilidad que permite a los agentes de usuario ofrecer funciones de representación gráfica más allá de las definidas en esta especificación.
Sintaxis:
<foreignObject x = "The x coordinate of the foreignObject"
y = "The x coordinate of the foreignObject"
width = "The width of the foreignObject"
height = "The height of the foreignObject">
</foreignObject>
- x = La coordenada x del objeto extraño.
- y = La coordenada x del objeto extraño.
- ancho = El ancho del objeto extranjero.
- altura = La altura del objeto extraño.
Atributos:
Ejemplo:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content=
"width=device-width,
initial-scale=1.0">
</head>
<body>
<svg viewBox="500 500 ">
<style>
div {
color: green;
font: 18px serif;
height: 100%;
overflow: auto;
background-color: black;
}
</style>
<foreignObject x="100" y="25"
width="160" height="160">
<div>
<br><br>GEEKSFORGEEKS<br><br>
</div>
</foreignObject>
</svg>
</body>
</html>
Producción:
Navegadores compatibles:
- Cromo
- Borde
- Ópera
- Explorador de Internet
- Safari
- Firefox
Publicación traducida automáticamente
Artículo escrito por epistler_999 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA