on
HTML
- Get link
- X
- Other Apps
SVG Tag
.png "Lecture 9")
<SVG>
SVG (Scalable Vector Graphics) ek XML (eXtensible Markup Language) based language hai, jise web developers vector graphics, images aur animations create karne ke liye use karte hain. Ismein kuch tags hote hain jo ki bahut hi important hote hain aur inhein SVG ke sath use kiya jata hai. Kuch important tags niche diye gaye hain:<g>
<g> tag ka use karte hue, kai SVG elements ko ek sath combine kiya ja sakta hai, jisse ek bada element create kiya ja sakta hai. Is tarah se, ek saath kai elements ko control kiya ja sakta hai, jaise ki unki position, color, opacity, and transformation. <g> tag ke saath, CSS ki madad se bhi style apply kiya ja sakta hai.
<g> tag ke kuch attributes bhi hote hain, jo ki bahut hi useful hote hain:
id: Ye attribute, ek unique identifier ka naam deta hai, jisse is group ko identify kiya ja sakta hai.
class: Ye attribute, ek class ka naam deta hai, jisse group ke saare elements ko ek saath style kiya ja sakta hai.
transform: Ye attribute, ek transformation ka command deta hai, jisse group ko rotate, scale, translate aur skew kiya ja sakta hai.
<g> tag
Example:
<svg width="200" height="200">
<g id="my-group">
<circle cx="50" cy="50" r="30" fill="red" />
<rect x="80" y="20" width="60" height="80" fill="blue" />
</g>
</svg>
transform attributes
<svg width="200" height="200">
<g id="my-group" transform="translate(50)">
<circle cx="50" cy="50" r="30" fill="red" />
<rect x="80" y="20" width="60" height="80" fill="blue" />
</g>
</svg>
<rect>
Ye tag ek rectangle ko define karta hai. Ismein rectangle ke x aur y coordinates, height aur width ko define kiya jata hai.
Example:
<svg width="200" height="200">
<rect x="50" y="50" width="100" height="80" fill="red" />
</svg>
<circle>
Ye tag ek circle ko define karta hai. Ismein circle ke center coordinates aur radius ko define kiya jata hai.
Examp:le
<!DOCTYPE html>
<html>
<head>
<title>SVG Example</title>
</head>
<body>
<svg width="200" height="200">
<circle cx="100" cy="100" r="50" fill="red" />
</svg>
</body>
</html>
umeed hai apko sare tags ache se samaj me aay hoge
next lecture k liye humri blog ko follow karte rahe aur agar apko humara blog
pasand aaya to apne dosto se bhi share kare. milte hai next lecture k liye tab
tak k liye allahafiz
"HTML Unleashed: A Comprehensive Guide"
"Mastering HTML: From Basics to Beyond"
"HTML Essentials: Building the Web"
"HTML Demystified: Tag by Tag"
"The HTML Playground: Your Coding Hub"
"Unlocking the Web: HTML Explained"
"HTML Wizardry: Crafting Web Pages"
"HTML Insights: A Developer's Handbook"
"HTML Made Simple: Learn and Create"
"HTML Chronicles: Your Journey Begins Here"
"FOR MY CHANNEL" ❤️LIKE 💬COMMENT 🔗SHARE ❗🔥🔥🔥🔥SUBSCRIBE NOW 🔔PRESS THE BELL ICON FOR
NOTIFICATION
Comments