اپنے ویب پیج پر SVG گرافکس کیسے ڈالیں

SVG یا اسکبلبل ویکٹر گرافکس آپ کو زیادہ پیچیدہ تصاویر کو اپنی طرف متوجہ کریں اور انہیں ویب صفحات پر فراہم کیجیئے. لیکن آپ صرف SVG ٹیگ نہیں لے سکتے ہیں اور انہیں اپنے ایچ ٹی ایم ایل میں پھیلاتے ہیں. وہ ظاہر نہیں کریں گے اور آپ کا صفحہ غلط ہوگا. اس کے بجائے، آپ کو تین طریقوں میں سے ایک کا استعمال کرنا ہوگا.

SVG کو ای میل کرنے کیلئے آبجیکٹ ٹیگ کا استعمال کریں

ایچ ٹی ایم ایل ٹیگ آپ کے ویب صفحہ میں SVG گرافک داخل کرے گا. آپ کو SVG فائل کو کھولنے کے لئے چاہتے ہیں کی وضاحت کرنے کے لئے ڈیٹا کی خاصیت کے ساتھ اعتراض ٹیگ لکھیں. آپ کو ایس وی جی کی تصویر کی چوڑائی اور اونچائی کی وضاحت کرنے کے لئے چوڑائی اور اونچائی کی صفات بھی شامل کرنا چاہئے (پکسلز میں).

کراس براؤزر کی مطابقت کے لۓ، آپ کو قسم کی خصوصیت شامل کرنا چاہئے، جو پڑھنا چاہیے:

قسم = "تصویر / svg + xml"

اور براؤزر کے لئے کوڈ کوڈ ہے جو اس کی حمایت نہیں کرتا (انٹرنیٹ ایکسپلورر 8 اور کم). آپ کا کوڈ بیس ایک براؤزر کے لئے SVG پلگ ان کی طرف اشارہ کرے گا جو SVG کی حمایت نہیں کرتی ہے. سب سے عام استعمال کردہ پلگ ان ایڈوب سے http://www.adobe.com/svg/viewer/install/ پر ہے. تاہم، یہ پلگ ان اب ایڈوب کی طرف سے حمایت نہیں کی ہے. ایک اور اختیار Savsese سافٹ ویئر ریسرچ سے http://www.savarese.com/software/svgplugin/ ایس ایس ایس ایس جی جی پلگ ان ہے.

آپ کا اعتراض اس طرح نظر آئے گا:

SVG کے لئے اعتراض استعمال کرنے کے لئے تجاویز

  • اس بات کو یقینی بنائیں کہ چوڑائی اور اونچائی کم سے کم ہو جاسکتی ہے جس کی تصویر آپ سرایت کر رہے ہو. دوسری صورت میں، آپ کی تصویر کلپ ہوسکتی ہے.
  • اگر آپ صحیح مواد کی قسم (ٹائپ = "تصویر / svg + xml") شامل نہیں کرتے ہیں تو آپ SVG کو صحیح طریقے سے ظاہر نہیں کرسکتے ہیں، لہذا میں اسے چھوڑنے کی سفارش نہیں کرتا.
  • آپ براؤزر کے لئے اعتراض ٹیگ کے اندر گرے جانے والے معلومات شامل کرسکتے ہیں جو SVG فائلوں کو ظاہر نہیں کریں گے.
  • آپ اپنے SVG اور پیرامیٹرز میں مواد کی قسم کا ذریعہ بھی مقرر کر سکتے ہیں. یہ IE 6 اور 7 میں بہتر کام کر سکتا ہے:
کلاسیکی = "CLSID: 1339B54C-3453-11 D2-93B9-000000000000" چوڑائی = "110" اونچائی = "60" کوڈ بیس = "http://www.savarese.com/software/svgplugin/">

نوٹ کریں کہ یہ ایک کام کرنے کے لئے ایک طبقے کی ضرورت ہے.

مثال کے طور پر ایک شے میں ایک SVG دیکھیں.

ای ڈی ٹی ٹی کے ساتھ ایس ایس جی کو شامل کریں

SVG سمیت آپ کے لئے ایک اور اختیار ٹیگ کا استعمال کرنا ہے. آپ تقریبا ایک ہی صفات کو اعتراض ٹیگ کے طور پر استعمال کرتے ہیں، بشمول چوڑائی <، اونچائی، قسم، اور کوڈ بیس>. صرف فرق یہ ہے کہ اعداد و شمار کے بجائے، آپ ایس ایس جی دستاویز یو آر ایل کو ایس ایس جی کی خصوصیت میں رکھیں.

آپ کا سرایت اس طرح نظر آئے گا:

src = "http://your-domain.here/z-circle.svg" چوڑائی = "210" اونچائی = "210" قسم = "تصویر / ایس جی ایس + xml" کوڈ بیس = "http://www.adobe.com" / svg / ناظرین / انسٹال "/>

SVG کے لئے اندراج کا استعمال کرنے کیلئے تجاویز

  • سرایت ٹیگ HTML4 درست نہیں ہے، لیکن یہ درست ایچ ٹی ایم ایل 5 ہے، لہذا اگر آپ اسے HTML4 صفحہ میں استعمال کرتے ہیں تو، آپ کو یاد رکھنا چاہئے کہ آپ کا صفحہ درست نہیں ہوگا.
  • بہترین مطابقت کے لئے ایس ایس ایس صفت میں ایک مکمل طور پر quoalified ڈومین نام کا استعمال کریں.
  • کچھ رپورٹس بھی موجود ہیں کہ ایڈوب پلگ ان کے ساتھ سرایت ٹیگ کا استعمال موزیلا ورژن 1.0 سے 1.4 تک پہنچ جائے گا.

مثال کے طور پر ٹیگ میں ایک SVG دیکھیں.

SVG شامل کرنے کے لئے ایک آئیرایم کا استعمال کریں

آپ کے ویب صفحات پر ایس ایس جی کی تصویر کو شامل کرنے کے لئے iframes ایک اور آسان طریقہ ہے. یہ صرف تین صفات کی ضرورت ہوتی ہے: ہمیشہ کی طرح چوڑائی اور اونچائی، اور ایس ایس جی آپ کے SVG فائل کے مقام پر اشارہ کرتے ہیں.

آپ کی آئی ایس آئی کو اس طرح نظر آئے گا: