SVG Inline ya HTML5

HTML5 inakubali SVG inayotumiwa kwenye kijumui

Je ni nini SVG?

  • SVG ni Scalable Vector Graphics
  • SVG inafikia kuzungumza vijemu vya kifaa kwa mtandao
  • SVG inatumia muundo wa XML kudumuza picha
  • Picha ya SVG inakubali ujuzi wa picha bila kupunguza ujuzi wa picha kama uenezi hauwezi kutengwa
  • SVG ni mabati wa Taasisi ya Internet

Matukio ya SVG

Kisha na muundo wa picha wengine (kama JPEG na GIF), matukio ya SVG ni:

  • Picha ya SVG inaweza kusakinishwa na kusasiriwa kwa kichwa chaandiko cha teksta
  • Picha ya SVG inaweza kutafutika, kusanduka, kusajili au kusababisha
  • SVG inaweza kutumika kwa ukubwa wa picha
  • Picha ya SVG inaweza kuchapwa kwa ujuzi wa picha kwa kila ukingo wa uenezi
  • SVG inaweza kutumika kwa ukubwa wa picha bila kupunguza ujuzi wa picha

Wapakusha wa Kifungu

Internet Explorer 9, Firefox, Opera, Chrome na Safari wameongea SVG kwa upande wa msingi.

Kuweka SVG kwa upande wa msingi wa HTML

Kwenye HTML5, unaweza kuweka elementi ya SVG kwa upande wa msingi wa HTML:

Mfano

<!DOCTYPE html>
<html>
<body>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">
  <polygon points="100,10 40,180 190,60 10,60 160,180"
  style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" />
</svg>

</body>
</html>

Mwongozo wa Kusikia

Matokeo:

Mafundisho ya SVG

Kwa kuelewa zaidi kuhusu SVG, tazama Mafundisho ya SVG.