Esta traducción está incompleta. Por favor, ayuda a traducir este artículo del inglés.
The svg
element can be used to embed an SVG fragment inside the current document (for example, an HTML document). This SVG fragment has its own viewport and coordinate system.
Usage context
Categorias | Elemento contenedor, Elemento estructural |
---|---|
Contenido permitido | Cualquier número de los siguientes elementos, en cualquier orden: Elementos de animación Elementos descriptivos Shape elements Elementos estructurales Gradient elements <a> , <altGlyphDef> , <clipPath> , <color-profile> , <cursor> , <filter> , <font> , <font-face> , <foreignObject> , <image> , <marker> , <mask> , <pattern> , <script> , <style> , <switch> , <text> , <view> |
Example
Consider the following SVG image (representing the national flag of Italy):
<svg xmlns="http://www.w3.org/2000/svg" width="150" height="100" viewBox="0 0 3 2"> <rect width="1" height="2" x="0" fill="#008d46" /> <rect width="1" height="2" x="1" fill="#ffffff" /> <rect width="1" height="2" x="2" fill="#d2232c" /> </svg>
It could be included in an HTML5 document as follows:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>HTML/SVG Example</title> </head> <body> <svg width="150" height="100" viewBox="0 0 3 2"> <rect width="1" height="2" x="0" fill="#008d46" /> <rect width="1" height="2" x="1" fill="#ffffff" /> <rect width="1" height="2" x="2" fill="#d2232c" /> </svg> </body> </html>
Attributes
Global attributes
- Conditional processing attributes »
- Core attributes »
- Document event attributes »
- Graphical event attributes »
- Presentation attributes »
class
style
externalResourcesRequired
Specific attributes
DOM Interface
This element implements the SVGSVGElement
interface.
Specifications
Specification | Status | Comment |
---|---|---|
Scalable Vector Graphics (SVG) 2 La definición de '<svg>' en esta especificación. |
Candidate Recommendation | |
Scalable Vector Graphics (SVG) 1.1 (Second Edition) La definición de '<svg>' en esta especificación. |
Recommendation | Initial definition |
Browser compatibility
Update compatibility data on GitHub
Desktop | Mobile | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Soporte básico | Chrome Soporte completo 1 | Edge Soporte completo Si | Firefox Soporte completo 1.5 | IE Soporte completo 9 | Opera Soporte completo 8 | Safari Soporte completo 3 | WebView Android Soporte completo 3 | Chrome Android Soporte completo Si | Edge Mobile Soporte completo Si | Firefox Android Soporte completo 4 | Opera Android Soporte completo Si | Safari iOS Soporte completo 3 | Samsung Internet Android ? |
baseProfile | Chrome Soporte completo Si | Edge ? | Firefox ? | IE ? | Opera ? | Safari ? | WebView Android Soporte completo Si | Chrome Android Soporte completo Si | Edge Mobile ? | Firefox Android ? | Opera Android ? | Safari iOS ? | Samsung Internet Android ? |
contentScriptType | Chrome Sin soporte No | Edge ? | Firefox ? | IE ? | Opera ? | Safari ? | WebView Android Sin soporte No | Chrome Android Sin soporte No | Edge Mobile ? | Firefox Android ? | Opera Android ? | Safari iOS ? | Samsung Internet Android ? |
contentStyleType | Chrome Sin soporte No | Edge ? | Firefox ? | IE ? | Opera ? | Safari ? | WebView Android Sin soporte No | Chrome Android Sin soporte No | Edge Mobile ? | Firefox Android ? | Opera Android ? | Safari iOS ? | Samsung Internet Android ? |
height | Chrome Soporte completo 1 | Edge Soporte completo Si | Firefox Soporte completo 1.5 | IE Soporte completo 9 | Opera Soporte completo 8 | Safari Soporte completo 3 | WebView Android Soporte completo 3 | Chrome Android Soporte completo Si | Edge Mobile Soporte completo Si | Firefox Android Soporte completo 4 | Opera Android Soporte completo Si | Safari iOS Soporte completo 3 | Samsung Internet Android ? |
preserveAspectRatio | Chrome Soporte completo 1 | Edge Soporte completo Si | Firefox Soporte completo 1.5 | IE Soporte completo 9 | Opera Soporte completo 8 | Safari Soporte completo 3 | WebView Android Soporte completo 3 | Chrome Android Soporte completo Si | Edge Mobile Soporte completo Si | Firefox Android Soporte completo 4 | Opera Android Soporte completo Si | Safari iOS Soporte completo 3 | Samsung Internet Android ? |
version | Chrome Soporte completo Si | Edge ? | Firefox ? | IE ? | Opera ? | Safari ? | WebView Android Soporte completo Si | Chrome Android Soporte completo Si | Edge Mobile ? | Firefox Android ? | Opera Android ? | Safari iOS ? | Samsung Internet Android ? |
viewBox | Chrome Soporte completo 1 | Edge Soporte completo Si | Firefox Soporte completo 1.5 | IE Soporte completo 9 | Opera Soporte completo 8 | Safari Soporte completo 3 | WebView Android Soporte completo 3 | Chrome Android Soporte completo Si | Edge Mobile Soporte completo Si | Firefox Android Soporte completo 4 | Opera Android Soporte completo Si | Safari iOS Soporte completo 3 | Samsung Internet Android ? |
width | Chrome Soporte completo 1 | Edge Soporte completo Si | Firefox Soporte completo 1.5 | IE Soporte completo 9 | Opera Soporte completo 8 | Safari Soporte completo 3 | WebView Android Soporte completo 3 | Chrome Android Soporte completo Si | Edge Mobile Soporte completo Si | Firefox Android Soporte completo 4 | Opera Android Soporte completo Si | Safari iOS Soporte completo 3 | Samsung Internet Android ? |
x | Chrome Soporte completo 1 | Edge Soporte completo Si | Firefox Soporte completo 1.5 | IE Soporte completo 9 | Opera Soporte completo 8 | Safari Soporte completo 3 | WebView Android Soporte completo 3 | Chrome Android Soporte completo Si | Edge Mobile Soporte completo Si | Firefox Android Soporte completo 4 | Opera Android Soporte completo Si | Safari iOS Soporte completo 3 | Samsung Internet Android ? |
y | Chrome Soporte completo 1 | Edge Soporte completo Si | Firefox Soporte completo 1.5 | IE Soporte completo 9 | Opera Soporte completo 8 | Safari Soporte completo 3 | WebView Android Soporte completo 3 | Chrome Android Soporte completo Si | Edge Mobile Soporte completo Si | Firefox Android Soporte completo 4 | Opera Android Soporte completo Si | Safari iOS Soporte completo 3 | Samsung Internet Android ? |
zoomAndPan | Chrome Soporte completo Si | Edge ? | Firefox ? | IE ? | Opera ? | Safari ? | WebView Android Soporte completo Si | Chrome Android Soporte completo Si | Edge Mobile ? | Firefox Android ? | Opera Android ? | Safari iOS ? | Samsung Internet Android ? |
Leyenda
- Soporte completo
- Soporte completo
- Sin soporte
- Sin soporte
- Compatibility unknown
- Compatibility unknown
- Deprecated. Not for use in new websites.
- Deprecated. Not for use in new websites.
Etiquetas y colaboradores del documento
Colaboradores en esta página:
BubuAnabelas,
mbenitez01
Última actualización por:
BubuAnabelas,