SVG nos ayuda a crear gráficos vectoriales escalables. Significa que los píxeles no se romperán al expandir la imagen, nos podemos servir de esta tecnología para dibujar ya sea para una página web o para la vida real llevando nuestra creatividad a imprimir fuera de, y se verá como lo veíamos en la pc, con una alta calidad.
SVG nos entrega gráficos vectoriales escalables en formato XML, ya que SVG es XML puro.
Todos los elementos y atributos de svg se pueden animar. Encuentro que también se puede trabajar los estilos del dibujo con CSS.
XML es una extensión de lenguaje de HTML, y como svg es puro xml. Solo basta tener un editor de texto más un navegador web. Para empezar a crear nuestra obra de arte.
Algo de que me he percatado, SVG al ser escrito en lenguaje XML. Todos los elementos svg deben ser cerrados correctamente pues a diferencia de HTML, xml es más estricto en la sintaxis. Por tanto no olvidemos ese detalle.
En mi investigación he encontrado formas predefinidos que svg ofrece a los desarrolladores, estas formas son 7. Rectángulo, círculo, elipse, línea, polilinea, polígono y ruta.
Ahora abre tu editor de texto (blog de notas) o usa tu editor de código favorito y crea tu primer dibujo básico de un sol.
- Crea un archivo index.html
- Crea una estructura básica html
- En medio de las etiquetas <\body> escriba los elementos xml debe verse así:
< body >
< svg width="620" height="200">
< circle cx="280" cy="60" r="40" stroke="yellow" stroke-width="5" fill="orange"/ > < \ svg >
< \ body >
- El resultado será un sol naranja con un borde amarillo.
Top comments (0)