Kumaha Pasang SVG grafik dina Kalurahan anjeun

SVG atanapi Véktor scalable grafik hayu maneh ngagambar Gambar leuwih kompléks tur geus aranjeunna rendered dina kaca wéb. Tapi anjeun teu bisa ngan saukur nyandak tag SVG na nyabok kana HTML Anjeun. Éta moal nembongkeun up na kaca anjeun bakal sah. Gantina, anjeun kudu make salah sahiji tilu métode.

Nganggo Tag Objék jeung Lebetkeun SVG

Tag HTML bakal Lebetkeun hiji grafis SVG dina kaca web Anjeun. Anjeun nulis tag obyék ku atribut data pikeun ngartikeun file SVG rék muka. Anjeun oge kedah ngawengku lebar tur jangkungna atribut keur ngartikeun lebar tur jangkungna gambar SVG anjeun (dina piksel).

Pikeun kasaluyuan cross-panyungsi, anjeun kedah kaasup atribut tipe, nu kedah maca:

tipe = "gambar / svg + XML"

sarta codebase pikeun panyungsi anu teu ngarojong eta (Internet Explorer 8 sarta handap). codebase anjeun bakal nunjuk ka plugin SVG pikeun panyungsi anu teu ngarojong SVG. plugin paling ilahar dipake nyaeta ti Adobe di http://www.adobe.com/svg/viewer/install/. Sanajan kitu, plugin ieu euweuh dirojong ku Adobe. pilihan sejen teh plugin Ssrc SVG ti Savarese Software Panalungtikan di http://www.savarese.com/software/svgplugin/.

obyek anjeun bakal kasampak kawas kieu:

Tips kanggo Maké obyék pikeun SVG

  • Pastikeun yén lebar jeung jangkungna téh sahanteuna sakumaha badag salaku gambar anjeun embedding. Upami teu kitu, gambar Anjeun bisa jadi clipped.
  • SVG Anjeun bisa jadi teu nembongkeun neuleu lamun teu kaasup tipe eusi bener (tipe = "gambar / svg + XML"), jadi kuring teu nyarankeun ninggalkeun eta kaluar.
  • Anjeun tiasa ngawengku informasi fallback jero tag obyék pikeun panyungsi anu moal nembongkeun file SVG.
  • Anjeun oge tiasa nyetel sumber SVG anjeun jeung tipe eusi dina parameter. Ieu bisa dianggo hadé dina IE 6 jeung 7:
classid = "CLSID: 1339B54C-3453-11D2-93B9-000000000000" lebar = "110" jangkungna = "60" codebase = "http://www.savarese.com/software/svgplugin/">

Catetan yen ieu merlukeun classid pikeun nyieun jalan.

Nempo hiji SVG dina conto tag obyék.

Lebetkeun SVG jeung Tag Lebetkeun

pilihan sejen anjeun boga keur kaasup SVG nyaeta ngagunakeun tag. Anjeun nganggo méh atribut sarua salaku tag obyék, kaasup lebar <, jangkungna, jenis, sarta codebase>. Hijina bédana éta gaganti data, anjeun nempatkeun URL dokumen SVG anjeun dina atribut src.

Lebetkeun anjeun bakal kasampak kawas kieu:

src = "http://your-domain.here/z-circle.svg" lebar = "210" jangkungna = "210" tipe = "gambar / svg + XML" codebase = "http://www.adobe.com / svg / panempo / install "/>

Tips kanggo Maké Lebetkeun pikeun SVG

  • Tag Lebetkeun teu valid HTML4, tapi éta HTML5 valid, jadi lamun make eta dina kaca HTML4, Anjeun kudu inget yen kaca anjeun moal sangkan méré konfirmasi.
  • Ngagunakeun ngaran domain pinuh quoalified dina atribut src pikeun kasaluyuan pangalusna.
  • Aya ogé sababaraha laporan nu ngagunakeun tag Lebetkeun jeung Adobe plugin bakal ngadat versi Mozilla 1.0 nepi 1.4.

Nempo hiji SVG dina conto tag Lebetkeun.

Paké mangrupa iframe ka Di antarana SVG

Iframes aya cara sejen gampang mun ngawengku hiji gambar SVG dina kaca web Anjeun. Ieu ngan merlukeun tilu atribut: lebar tur jangkungna saperti biasa, tur src ngarah ka lokasi file SVG Anjeun.

iframe anjeun bakal kasampak kawas kieu: