SVG vai Scalable Vector Graphics ļauj jums izdarīt daudz sarežģītākus attēlus un padarīt tos padarīt tīmekļa lapās. Bet jūs nevarat vienkārši uzņemt SVG tagus un ielīmēt tos savā HTML formātā. Tās netiks rādītas, un jūsu lapa būs nederīga. Tā vietā jums jāizmanto viena no trim metodēm.
Izmantojiet objekta tagu, lai ievietotu SVG
HTML tagā jūsu tīmekļa lapā tiks ievietota SVG grafika. Jūs rakstāt objekta tagu ar datu atribūtu, lai noteiktu SVG failu, kuru vēlaties atvērt. Jums jāiekļauj arī platuma un augstuma atribūti, lai noteiktu SVG attēla platumu un augstumu (pikseļos).
Pārrobežu pārlūku saderībai jāiekļauj tipa atribūts, kas jālasa sekojoši:
type = "image / svg + xml"
un pārlūkprogrammu koda bāze, kas to neatbalsta (Internet Explorer 8 un jaunāka versija). Jūsu koda bāzē norādīts uz SVG spraudni pārlūkiem, kas neatbalsta SVG. Visbiežāk izmantotais spraudnis ir no Adobe vietnē http://www.adobe.com/svg/viewer/install/. Tomēr šis spraudnis Adobe vairs netiek atbalstīts. Vēl viena iespēja ir Ssrc SVG spraudnis no Savarese Software Research vietnē http://www.savarese.com/software/svgplugin/.
Jūsu objekts izskatās šādi:
Padomi, kā izmantot SVG objektu
- Pārliecinieties, ka platums un augstums ir vismaz tik lieli kā jūsu ievietotais attēls. Pretējā gadījumā jūsu attēls var tikt izgriezts.
- Jūsu SVG var neparādīties pareizi, ja neiekļaujat pareizo satura veidu (
type = "image / svg + xml"), tādēļ es nepiedāvāju to atstāt. - Jūs varat iekļaut rezerves informāciju iekšpusē
objektstag pārlūkiem, kas nerādīs SVG failus. - Varat arī iestatīt SVG avotu un satura tipu parametriem. Tas var labāk darboties IE 6 un 7:
classid = "CLSID: 1339B54C-3453-11D2-93B9-000000000000" width = "110" height = "60" codebase = "http://www.savarese.com/software/svgplugin/">
Ņemiet vērā, ka tas prasa classid, lai tas darbotos.
Objekta taga piemērā skatīt SVG.
Iegult SVG ar Embed tagu
Vēl viena iespēja SVG iekļaušanai ir izmantot tagu. Jūs izmantojat gandrīz tādus pašus atribūtus kā objekta tagu, tostarp platumu <, augstumu, tipu un koda bāzi>. Vienīgā atšķirība ir tā, ka tā vietā datus, jūs ievietojat SVG dokumenta URL atribūtā src.
Jūsu embeds izskatās šādi:
src = "http://your-domain.here/z-circle.svg" width = "210" height = "210" type = "image / svg + xml" codebase = "http://www.adobe.com / svg / skatītājs / instalēt "/>
Padomi par Ievietošanas izmantošanu SVG
- Ievadītais tags nav derīgs HTML4, taču tas ir derīgs HTML5, tādēļ, ja to izmantojat HTML4 lapā, jums jāatceras, ka jūsu lapa netiks validēta.
- Lai vislabākā saderība, izmantojiet atribūtu src pilnībā izlīdzinātu domēna nosaukumu.
- Ir arī daži ziņojumi, ka, izmantojot iegulto tagu, izmantojot Adobe spraudni, tiks pārtraukta Mozilla versijas no 1.0 līdz 1.4.
Skatīt emuāra tagu piemērā SVG.
Izmantojiet iframe, lai iekļautu SVG
Iframes ir vēl viens vienkāršs veids SVG attēla pievienošanai jūsu tīmekļa lapās. Tam vajag tikai trīs atribūtus: platums un augstums, kā parasti, un src, kas norāda uz jūsu SVG faila atrašanās vietu.
Jūsu iframe būtu šāds:
Padomi iFrame izmantošanai SVG
Iframe parādīsies ar robežu ap jūsu attēlu, ja vien jūs neizņemat robežu ar stilu, piemēram,
style = "robeža: nav;"
Iframe nav norādīta spraudņa atrašanās vieta, tādēļ, ja klienta pārlūkprogrammai nav spraudņa, viņi, iespējams, neredz neko, vai arī viņi var redzēt kļūdas ziņojumu.
Skatīt SVG par iframe tagu piemēru.
