Ihe mere I ji jiri SVG mee ihe na weebụsaịtị gi taa

Uru nke iji Scalable Vector Graphics

Scalable Vector Graphics, ma ọ bụ SVG, na-arụ ọrụ dị mkpa n'ime nhazi weebụ. Ọ bụrụ na ị naghị eji SVG ugbu a na ọrụ ịme weebụ gị, ebe a bụ ụfọdụ ihe mere ị ga-eji malite ime nke a, yana ịdaba na ị nwere ike iji maka ihe nchọgharị ochie ndị na-akwadoghị faịlụ ndị a.

Mkpebi

Enwere uru kasịnụ nke SVG bụ nnwere onwe mkpebi. N'ihi na SVG faịlụ bụ vector ndịna-emeputa karịa onyinyo nke raster dabeere na pixels, ha nwere ike ịmegharia n'enweghi ọdịdị oyiyi ọ bụla. Nke a na-enye aka karịsịa mgbe ị na-ekepụta weebụsaịtị ndị na-anabata ozi ọma ndị dị mkpa ka ha dị mma ma na-arụ ọrụ nke ọma n'ofe ọtụtụ nha ihu na ngwaọrụ .

Enwere ike iwepụta faịlụ SVG elu ma ọ bụ ala iji nweta mgbanwe na nhazi nke mkpa nke ebe nrụọrụ weebụ gị ma ọ dịghị mkpa ka ị na-echegbu onwe gị banyere ndị na-ese foto na-eme ka ihe ọ bụla dị mma.

Size File

Otu n'ime ihe ịma aka na iji ihe raster (JPG, PNG, GIF) na ebe nrụọrụ weebụ na- anabata ozi bụ faịlụ nke ihe oyiyi ndị ahụ. Ebe ọ bụ na eserese eserese anaghị adaba n'ụzọ nke ndị na-achọsi ike, ọ dị mkpa ka ị na-ezipụ ihe oyiyi eserese gị na nke kachasị na ha ga-egosipụta. Nke a bụ n'ihi na ị nwere ike ime ka obere oyiyi dị ntakịrị ma jidekwa àgwà ya, mana otu ihe ahụ abụghị eziokwu maka ime ka ihe oyiyi buru ibu. Ihe njedebe bụ na ị na-enwekarị foto ndị dị nnọọ ukwuu karịa ka egosipụtara ha na ihuenyo mmadụ, nke pụtara na a manyere ha ka ha budata nnukwu faịlụ.

SVG na-agwa ihe ịma aka a. Ebe ọ bụ na ndị na-ese foto nwere ike ịdaba, ị nwere ike ịnwe nha obere faịlụ n'agbanyeghị agbanyeghị ka nnukwu ihe oyiyi ahụ dị. Nke a ga-emesị nwee mmetụta dị mma na arụmọrụ zuru oke nke saịtị na nbudata ọsọ ọsọ.

CSS agba

A pụkwara itinye koodu SVG kpọmkwem na HTML nke ibe. A maara nke a dị ka "SVG inline". Otu n'ime uru nke iji SVG ederede bụ na ebe ọ bụ na ndị na-ese foto na-adọrọ mmasị na ihe nchọgharị ahụ dabere na koodu gị, ọ dịghị mkpa ime arịrịọ HTTP iji kpọta faịlụ ihe oyiyi. Uru ọzọ bụ na a na-edepụta SVG inline na CSS.

Achọrọ ịgbanwe agba nke akara SVG? Kama ịchọrọ ịmepee onyinyo ahụ na ụfọdụ ụdị mmezi software na mbupụ na bulite faịlụ ọzọ, ị nwere ike ịgbanwe faịlụ SVG naanị na ole na ole nke CSS.

I nwekwara ike iji usoro CSS ndị ọzọ na SVG ndịna-emeputa iji gbanwee ha na ọnọdụ hover ma ọ bụ maka ụfọdụ imewe mkpa. Ịnwere ike ịmegharị ndị na-eme ihe ngosi ahụ ka ị gbakwunye arụmọrụ na mmekọrịta na ibe.

Ihe ngosi

N'ihi na faịlụ SVG inline nwere ike imepụta ya na CSS, i nwere ike iji CSS eme ihe na ha. CSS gbanwere na transitions bụ ụzọ abụọ dị mfe iji gbakwunye ndụ SVG faịlụ. Ị nwere ike ịnweta ahụmahụ Flash na-amasị dị na peeji nke na-enweghị ịda mbà nke na-abịa site n'iji Flash na ebe nrụọrụ weebụ taa.

Ojiji SVG

Dị ka ike dị ka SVG bụ, ndị a ndịna-emeputa enweghị ike dochie ihe oyiyi ọ bụla ọzọ ị na-eji na ebe nrụọrụ weebụ gị. Foto ndị chọrọ agba omimi miri emi ka ga-abụ JPG ma ọ bụ ma eleghị anya faịlụ PNG, mana ihe oyiyi dị mfe dị ka akara ngosi zuru oke ka e gbuo ya dịka SVG.

SVG nwekwara ike ịbụ ihe kwesịrị ekwesị maka ihe atụ dị mgbagwoju anya, dị ka akwụkwọ akụkọ ma ọ bụ eserese ụlọ ọrụ. Ndị niile na-ese foto ga-erite uru site na ịnwe ike, enwere ike imepụta ya na CSS, na uru ndị ọzọ e depụtara na nke a.

Nkwado maka Nchọgharị Okenye

Ugbu a maka nkwado SVG dị ezigbo mma n'oge a. Nanị ihe nchọgharị ndị na-enweghị nkwado maka ndị a bụ ndị nsụgharị nke Internet Explorer (Version 8 na n'okpuru) na ederede ochie nke Android. Na nkenke, obere pasent nke ndị na-eme nchọgharị ka na-eji ihe nchọgharị ndị a eme ihe, ọnụ ọgụgụ ahụ ka na-agbagha. Nke a pụtara na SVG nwere ike iji mara n'enweghị nsogbu na weebụsaịtị taa.

Ọ bụrụ na ịchọrọ inye ọdịda maka SVG, ịnwere ike iji ngwá ọrụ dịka Grumpicon si Group Filament. Akụ a ga-ewepụta faịlụ SVG gị ma mee ka PNG ghara ịdaba maka ihe nchọgharị ochie.

Edited by Jeremy Girard na 1/27/17