HTML5 में SVG का उपयोग करके आकार कैसे बनाएं?

SVG का अर्थ स्केलेबल वेक्टर ग्राफिक्स है। आप HTML5 में SVG का उपयोग करके सर्कल, आयत, रेखा आदि आकार आसानी से बना सकते हैं। आइए SVG का उपयोग करके आयत बनाने का एक उदाहरण देखें।

उदाहरण

HTML5 में आयत बनाने के लिए निम्न कोड चलाएं। <rect> एलिमेंट का उपयोग किया जाएगा:

<!DOCTYPE html> <html>    <head>       <style>          #svgelem {             position: relative;             left: 10%;             -webkit-transform: translateX(-20%);             -ms-transform: translateX(-20%);             transform: translateX(-20%);          }       </style>       <title>SVG</title>    </head>    <body>       <h2>HTML5 SVG आयत</h2>       <svg id="svgelem" width="300" height="200" xmlns="https://www.w3.org/2000/svg">          <rect width="200" height="100" fill="green"/>       </svg>    </body> </html>

SVG में अन्य आकार बनाने के लिए <circle>, <ellipse>, <line>, <polygon>, <polyline>, <path> आदि एलिमेंट्स का उपयोग करें।