Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> JavaScript

HTML5 SVG से स्टार शेप बनाएं


यहां एक SVG उदाहरण का HTML5 संस्करण है जो <polygon> टैग का उपयोग करके एक स्टार बनाएगा।

 <html> 
    <head> 
        <style> 
            #svgelem{ 
                position: relative; 
                left: 50%; 
                -webkit-transform: translateX(-40%); 
                -ms-transform: translateX(-40%); 
                transform: translateX(-40%); 
            } 
        </style> 
        <title>SVG</title> 
        <meta charset="utf-8" /> 
    </head> 
    <body> 
        <h2 align = "center">HTML5 SVG Star</h2> 
        <svg id = "svgelem" height = "200" xmlns = "https://www.w3.org/2000/svg"> 
            <polygon points = "100,10 40,180 190,60 10,60 160,180" fill = "red"/> 
        </svg> 
    </body> </html>

आउटपुट

HTML5 SVG से स्टार शेप बनाएं


  1. HTML5 SVG से स्टार शेप बनाएं HTML5 SVG से स्टार शेप बनाएं

    यहां एक SVG उदाहरण का HTML5 संस्करण है जो <polygon> टैग का उपयोग करके एक स्टार बनाएगा। <html> <head> <style> #svgelem{ position: relative; left: 50%; -webkit-transform: translateX(-40%);

  1. HTML5 SVG में गोल कोनों वाला आयत कैसे बनाएं? HTML5 SVG में गोल कोनों वाला आयत कैसे बनाएं?

    SVG का अर्थ स्केलेबल वेक्टर ग्राफिक्स है। HTML SVG में आयत बनाने के लिए SVG <rect> एलिमेंट का उपयोग करें। गोल कोनों के लिए, rx और ry एट्रिब्यूट सेट करें, जो आयत के कोनों को गोल करते हैं।उदाहरणHTML5 SVG में गोल कोनों वाला आयत बनाने का तरीका सीखने के लिए निम्न कोड चलाएं:<!DOCTYPE html> <

  1. HTML5 में स्केलेबल वेक्टर ग्राफिक्स (SVG) के साथ कैसे काम करें? HTML5 में स्केलेबल वेक्टर ग्राफिक्स (SVG) के साथ कैसे काम करें?

    SVG का अर्थ स्केलेबल वेक्टर ग्राफिक्स है और यह XML में 2D-ग्राफिक्स और ग्राफिकल एप्लिकेशन का वर्णन करने की एक भाषा है जिसे SVG व्यूअर द्वारा रेंडर किया जाता है।SVG ज्यादातर वेक्टर प्रकार के डायग्राम जैसे पाई चार्ट, X,Y कोऑर्डिनेट सिस्टम में दो-आयामी ग्राफ आदि के लिए उपयोगी है।HTML5 में स्केलेबल वेक्