SVG ko Scalable Vector Graphics bari ka samo hotunan hotuna da yawa kuma sun sanya su a kan shafukan intanet. Amma ba za ku iya ɗaukar takardun SVG kawai ba kuma ku buga su cikin HTML. Ba za su iya nunawa ba kuma shafinku ba zai dace ba. Maimakon haka, dole kayi amfani da ɗaya daga cikin hanyoyi uku.
Yi amfani da Object Tag to Embed SVG
Da adireshin HTML za ta saka wani SVG mai hoto a shafin yanar gizonku. Kayi rubutun tag tare da alamar bayanai don ƙayyade fayil ɗin SVG da kake son budewa. Ya kamata ka hada da nisa da tsawo tsawo don ƙayyade nisa da tsawo na siffar SVG (a cikin pixels).
Domin haɗin giciye-browser, ya kamata ka hada da nau'in nau'in nau'in, wanda ya kamata ya karanta:
type = "image / svg + xml"da kuma kundin shafukan yanar gizo don masu bincike waɗanda ba su goyi bayan shi ba (Internet Explorer 8 da ƙananan). Your codebase zai nuna zuwa wani SVG plugin ga masu bincike da cewa ba su goyi bayan SVG. Mafi amfani da plugin daga Adobe ne a http://www.adobe.com/svg/viewer/install/. Duk da haka, wannan na'urar ba ta da tallafin Adobe. Wani zaɓi shine Ssrc SVG plugin daga Savarese Software Research a http://www.savarese.com/software/svgplugin/.
Your abu zai yi kama da wannan:
Tips don Amfani abu don SVG
- Tabbatar cewa nisa da tsawo suna da maƙallaci kamar girman da kake ciki. In ba haka ba, za a iya cire hotonku.
- SVG ɗinku bazai nuna ba daidai ba idan ba ku haɗa da nau'in abun ciki daidai ba (type = "image / svg + xml"), don haka ba na bayar da shawarar barin shi ba.
- Kuna iya haɗawa da bayanan bayanan da ke cikin abin da aka yi wa masu bincike wanda bazai nuna fayilolin SVG ba.
- Hakanan zaka iya saita tushen SVG da nau'in abun ciki a cikin sigogi. Wannan na iya aiki mafi alhẽri a IE 6 da 7:
Lura cewa wannan yana buƙatar ajiya don yin aiki.
Duba SVG a cikin misali alama alama.
Shiga SVG tare da Embed Tag
Wani zabin da kake da shi ya hada da SVG shine amfani da tag. Kuna amfani da nau'in halayen guda kamar nau'in abu, wanda ya haɗa da nisa <, tsawo, nau'in, da kuma codebase>. Bambanci shine kawai a maimakon bayanai, kun sanya SVG takardun URL a cikin src attribute.
Your embed zai yi kama da wannan:
src = "http://your-domain.here/z-circle.svg" width = "210" tsawo = "210" type = "image / svg + xml" codebase = "http://www.adobe.com / svg / mai kallo / shigar "/>Tips don amfani Embed ga SVG
- Alamar tagulla bata dace da HTML4 ba, amma yana da m HTML5, don haka idan kun yi amfani da ita a cikin HTML4 page, ya kamata ku tuna cewa shafinku ba zai inganta ba.
- Yi amfani da sunan yankin da aka ƙaddara a cikin src attribute don mafi dacewa.
- Har ila yau akwai wasu rahotannin cewa yin amfani da alamar embed tare da Adobe plugin zai haddasa fasalin Mozilla 1.0 zuwa 1.4.
Duba SVG a cikin misali alamar embed.
Yi amfani da iframe don hada SVG
Iframes wata hanya ce mai sauƙi ta haɗa da hoton SVG a shafukan yanar gizonku. Yana buƙatar halayen guda uku: nisa da tsawo kamar yadda aka saba, da kuma src yana nuna wurin wurin SVG ɗinku.
Iyalinka zai yi kama da wannan: