What is SVG and why is it used ?

  • SVG- Scalar Vector Graphics.
  • It is a popular tool for displaying two-dimensional charts, graphics and illustrations on websites.
  • Without losing any of its resolution it can be scaled up or down.
  • It can be animated in every element and attribute.
  • SVG images are stored in XML text files and defined in a Vector graphics.
  • SVG files can be compressed, scripted, indexed, and searched and  scaled in size without loss of quality.
  • They are rendered by most used web browsers and Then the XML text files can be created and edited with vector graphics editors or  text editors.
  • At any resolution SVG images can be printed with high quality.
  • If they are zoomed or resized SVG graphics do NOT lose any quality.

Syntax:

<!DOCTYPE html>
<html>
<body>
<h1>My first SVG</h1>
<svg width="100" height="100">
<circle cx="50" cy="50" r="40" stroke="blue" stroke-width="4" fill="pink" />
Sorry, your browser does not support inline SVG.
</svg>
</body>
</html>

 

Output:

Leave a Reply

Your email address will not be published. Required fields are marked *

You May Also Like

What is Grid system ?

It is a structure comprising a series of vertical and horizontal lines which intersect and used to arrange content. Is a way of providing a system that designers can work with…
View Answer

What is Semantic HTML ?

It is essential to understand the meaning of words during communication in any language. It becomes more critical and provides more semantic elements which make it easy to understand the…
View Answer

What is the difference between SOAP and REST ?

                  SOAP                    REST It is a protocol. It is an architectural style. SOAP- Simple Object Access Protocol. REST- Representational State Transfer. It can’t use REST because it is a…
View Answer