SVG درون‌محتوایی HTML5

HTML5 ان لائن SVG کا سپورٹ فراہم کرتا ہے

SVG کیا ہے؟

  • SVG قابل انعطاف ویژن گرافکس (Scalable Vector Graphics) کا مطلب ہے
  • SVG استعمال کئی ویژن گرافیک برائے نیٹ ورک
  • SVG از فرمت XML برای تعریف گرافیک استفاده می‌کند
  • تصاویر SVG در صورت بزرگ کردن یا تغییر اندازه، کیفیت تصویر خود را از دست نمی‌دهند
  • SVG استاندارد وب‌شبکه است

مزایای SVG

مزایای استفاده از SVG در مقایسه با فرمت‌های تصویری دیگر (مانند JPEG و GIF) عبارتند از:

  • تصاویر SVG می‌توانند با ویرایشگرهای متنی ایجاد و ویرایش شوند
  • تصاویر SVG می‌توانند جستجو، شمارش، اسکریپت یا فشرده‌سازی شوند
  • SVG قابل انعطاف است
  • تصاویر SVG می‌توانند در هر رزولوشنی با کیفیت بالا چاپ شوند
  • SVG می‌تواند بدون کاهش کیفیت تصویر بزرگ شود

پشتیبانی مرورگر

Internet Explorer 9، Firefox، Opera، Chrome و Safari از SVG درون‌ریز پشتیبانی می‌کنند.

SVG مستقیماً در صفحه HTML قرار دهید

در HTML5، شما می‌توانید عناصر SVG را مستقیماً در صفحه HTML قرار دهید:

مثال

<!DOCTYPE html>
<html>
<body>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">
  <polygon points="100,10 40,180 190,60 10,60 160,180"
  style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" />
</svg>

</body>
</html>

آزمایش کنید

نتیجه:

آموزش SVG

برای یادگیری بیشتر در مورد SVG، لطفاً از آموزش SVG.