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.

You May Also Like

What is Flexbox ?

It is a one-dimensional layout model that has efficient and flexible layouts with distributed spaces among items to control their alignment structure in CSS . It is a layout model…
View Answer

What is JS ?

It is a small piece of javascript program that can add user interactivity to your website. A Script could provide a dropdown menu and generate a pop-up alert box message.…
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

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