ວິທີການໃສ່ SVG Graphics ໃນເວັບໄຊທ໌ຂອງທ່ານ

SVG ຫຼື Scalable Vector Graphics ຊ່ວຍໃຫ້ທ່ານແຕ້ມຮູບພາບທີ່ສະລັບສັບຊ້ອນຫຼາຍ ແລະໃຫ້ພວກເຂົາສະແດງຢູ່ຫນ້າເວັບ. ແຕ່ທ່ານບໍ່ສາມາດໃຊ້ tags SVG ແລະ slap ພວກເຂົາເຂົ້າໃນ HTML ຂອງທ່ານ. ພວກເຂົາຈະບໍ່ສະແດງແລະຫນ້າເວັບຈະບໍ່ຖືກຕ້ອງ. ແທນທີ່ຈະ, ທ່ານຕ້ອງໃຊ້ຫນຶ່ງໃນສາມວິທີ.

ໃຊ້ tag ວັດຖຸເພື່ອຝັງ SVG

ແທໍກ HTML ຈະຝັງຮູບພາບ SVG ໃນຫນ້າເວັບຂອງທ່ານ. ທ່ານຂຽນ tag object ກັບ attribute ຂໍ້ມູນເພື່ອກໍານົດໄຟລ໌ SVG ທີ່ທ່ານຕ້ອງການເປີດ. ທ່ານຄວນປະກອບມີຄຸນສົມບັດຄວາມກວ້າງແລະຄວາມສູງເພື່ອກໍານົດຄວາມກວ້າງແລະຄວາມສູງຂອງຮູບ SVG ຂອງທ່ານ (ໃນ pixels).

ສໍາລັບການເຂົ້າກັນຂອງຕົວທ່ອງເວັບຂ້າມ, ທ່ານຄວນປະກອບມີຄຸນລັກສະນະປະເພດ, ເຊິ່ງຄວນອ່ານ:

type = "image / svg + xml"

ແລະພື້ນຖານ codebase ສໍາລັບຕົວທ່ອງເວັບທີ່ບໍ່ສະຫນັບສະຫນູນມັນ (Internet Explorer 8 ແລະຕ່ໍາກວ່າ). ຖານຂໍ້ມູນຂອງທ່ານຈະຊີ້ໃຫ້ເຫັນ plugin SVG ສໍາລັບຕົວທ່ອງເວັບທີ່ບໍ່ສະຫນັບສະຫນູນ SVG. ໂປແກຼມທີ່ຖືກນໍາໃຊ້ຫຼາຍທີ່ສຸດແມ່ນ Adobe ທີ່ http://www.adobe.com/svg/viewer/install/. ຢ່າງໃດກໍ່ຕາມ, ໂປແກຼມນີ້ບໍ່ຖືກສະຫນັບສະຫນູນໂດຍ Adobe. ທາງເລືອກອື່ນແມ່ນ Ssrc SVG plugin ຈາກ Savarese Software Research ທີ່ http://www.savarese.com/software/svgplugin/.

ວັດຖຸຂອງທ່ານຈະຄືແນວນີ້:

ຄໍາແນະນໍາສໍາລັບການນໍາໃຊ້ວັດຖຸສໍາລັບ SVG

  • ໃຫ້ແນ່ໃຈວ່າຄວາມກວ້າງແລະຄວາມສູງແມ່ນນ້ອຍທີ່ສຸດເທົ່າທີ່ຮູບພາບທີ່ທ່ານກໍາລັງຝັງຢູ່. ຖ້າບໍ່ດັ່ງນັ້ນ, ຮູບພາບຂອງທ່ານອາດຈະຖືກປິດລົງ.
  • SVG ຂອງທ່ານອາດຈະບໍ່ສະແດງຢ່າງຖືກຕ້ອງຖ້າທ່ານບໍ່ປະກອບປະເພດເນື້ອຫາທີ່ຖືກຕ້ອງ (type = "image / svg + xml"), ດັ່ງນັ້ນຂ້ອຍບໍ່ແນະນໍາໃຫ້ມັນອອກ.
  • ທ່ານສາມາດປະກອບຂໍ້ມູນຂໍ້ມູນທີ່ຖອຍຫລັງພາຍໃນປ້າຍວັດຖຸສໍາລັບຕົວທ່ອງເວັບທີ່ຈະບໍ່ສະແດງໄຟລ໌ SVG.
  • ທ່ານຍັງສາມາດກໍານົດແຫຼ່ງ SVG ຂອງທ່ານແລະປະເພດເນື້ອຫາໃນພາລາມິເຕີ. ນີ້ອາດເຮັດວຽກໄດ້ດີໃນ IE 6 ແລະ 7:
classid = "CLSID: 1339B54C-3453-11D2-93B9-000000000000" width = "110" height = "60" codebase = "http: // wwwsavaresecom / software / sggplugin /">

ໃຫ້ສັງເກດວ່ານີ້ຮຽກຮ້ອງໃຫ້ມີ classid ເພື່ອເຮັດໃຫ້ມັນເຮັດວຽກ.

ເບິ່ງ SVG ໃນຕົວຢ່າງໂຄດຄໍາສັ່ງຂອງວັດຖຸ.

ຝັງ SVG ດ້ວຍແທັບ Embed

ທາງເລືອກອື່ນທີ່ທ່ານມີສໍາລັບລວມທັງ SVG ແມ່ນການນໍາໃຊ້ແທັກ. ທ່ານໃຊ້ຄຸນະລັກສະນະເກືອບເຊັ່ນດຽວກັບແທໍກວັດຖຸ, ລວມທັງ width <, height, type, ແລະ codebase>. ຄວາມແຕກຕ່າງພຽງແຕ່ວ່າແທນທີ່ຈະຂໍ້ມູນ, ທ່ານເອົາ URL ຂອງເອກະສານ SVG ຂອງທ່ານຢູ່ໃນ src attribute.

ການຕິດຂອງທ່ານຈະຄ້າຍຄືນີ້:

src = "http: // yours-domainhere / z-circlesvg" width = "210" height = "210" type = "image / svg + xml" codebase = "http: // wwwadobecom / svg / viewer / install "/>

Tips for Using Embed for SVG

  • ໂຄດຄໍາສັ່ງບໍ່ແມ່ນ HTML4 ທີ່ຖືກຕ້ອງ, ແຕ່ວ່າມັນແມ່ນ HTML5 ທີ່ຖືກຕ້ອງ, ດັ່ງນັ້ນຖ້າທ່ານໃຊ້ມັນໃນຫນ້າ HTML4, ທ່ານຄວນລະວັງວ່າຫນ້າເວັບຈະບໍ່ຖືກຕ້ອງ.
  • ໃຊ້ຊື່ໂດເມນທີ່ມີຊື່ quoalified ຢ່າງສົມບູນໃນ src attribute ສໍາລັບຄວາມເຂົ້າກັນໄດ້ທີ່ດີທີ່ສຸດ.
  • ນອກຈາກນີ້ຍັງມີບົດລາຍງານບາງຢ່າງວ່າການນໍາໃຊ້ໂຄດຄໍາສັ່ງທີ່ມີໂປແກຣມ Adobe plugin ຈະທໍາລາຍ Mozilla ຮຸ່ນ 1.0 ຫາ 1.4.

ເບິ່ງ SVG ໃນຕົວຢ່າງແທັກ embed.

ໃຊ້ iframe ເພື່ອລວມ SVG

Iframes ແມ່ນວິທີງ່າຍໆທີ່ຈະປະກອບຮູບພາບ SVG ໃນຫນ້າເວັບຕ່າງໆຂອງທ່ານ. ມັນຈໍາເປັນຕ້ອງມີສາມຄຸນລັກສະນະ: ຄວາມກວ້າງແລະຄວາມສູງຕາມປົກກະຕິແລະ src ຊີ້ໄປຫາສະຖານທີ່ຂອງໄຟລ໌ SVG ຂອງທ່ານ.

iframe ຂອງທ່ານຈະຄືແນວນີ້: