एसवीजी स्ट्रोक गुण
एसवीजी स्ट्रोक गुण
एसवीजी स्ट्रोक गुणों की एक विस्तृत श्रृंखला प्रदान करता है। इस अध्याय में हम निम्नलिखित को देखेंगे:
- आघात
- रेखा की चौड़ाई
- स्ट्रोक-लाइनकैप
- स्ट्रोक-दशरे
सभी स्ट्रोक गुण किसी भी प्रकार की रेखाओं, पाठ और वृत्त जैसे तत्वों की रूपरेखा पर लागू किए जा सकते हैं।
एसवीजी स्ट्रोक संपत्ति
स्ट्रोक गुण किसी तत्व की रेखा, पाठ या रूपरेखा के रंग को परिभाषित करता है:
यहाँ एसवीजी कोड है:
उदाहरण
<svg height="80" width="300">
<g fill="none">
<path stroke="red" d="M5 20 l215 0" />
<path stroke="black" d="M5 40 l215 0" />
<path stroke="blue" d="M5 60 l215 0" />
</g>
</svg>
एसवीजी स्ट्रोक-चौड़ाई संपत्ति
स्ट्रोक-चौड़ाई संपत्ति किसी तत्व की रेखा, पाठ या रूपरेखा की मोटाई को परिभाषित करती है:
यहाँ एसवीजी कोड है:
उदाहरण
<svg height="80" width="300">
<g fill="none" stroke="black">
<path stroke-width="2" d="M5 20 l215 0" />
<path stroke-width="4" d="M5 40 l215 0" />
<path stroke-width="6" d="M5 60 l215 0" />
</g>
</svg>
एसवीजी स्ट्रोक-लाइनकैप संपत्ति
स्ट्रोक-लाइनकैप गुण खुले पथ के लिए विभिन्न प्रकार के अंत को परिभाषित करता है:
यहाँ एसवीजी कोड है:
उदाहरण
<svg height="80" width="300">
<g fill="none" stroke="black" stroke-width="6">
<path stroke-linecap="butt" d="M5 20 l215 0" />
<path stroke-linecap="round" d="M5 40 l215 0" />
<path stroke-linecap="square" d="M5 60 l215 0" />
</g>
</svg>
एसवीजी स्ट्रोक-दशरे संपत्ति
स्ट्रोक-डैशरे गुण का उपयोग धराशायी रेखाएँ बनाने के लिए किया जाता है:
यहाँ एसवीजी कोड है:
उदाहरण
<svg height="80" width="300">
<g fill="none" stroke="black" stroke-width="4">
<path stroke-dasharray="5,5" d="M5 20 l215 0" />
<path stroke-dasharray="10,10" d="M5 40 l215 0" />
<path stroke-dasharray="20,10,5,5,5,10" d="M5 60 l215 0" />
</g>
</svg>