Sok időt töltöttünk az inline és az elem használatáról. Felépíthet egy ikonrendszert, amely előnyökben rejlik.
Bármilyen más módon létrehozhat SVG ikonrendszert. Kihelyezhet egy hagyományos rácsos sprite lapot az SVG-ben, és háttér-helyzetű sprite-eket tehet, mint a raszteres képeknél. A jövőben használhatja a töredékazonosítókat, így még egy kicsit könnyebbé válik. További információ ezekről a dolgokról.
Egy másik módszer az SVG-kép adat URI-jának beágyazása közvetlenül egy CSS-fájlba. Ezt a megközelítést alkalmazza Grunticon.
A Grunticon egy Grunt plugin egy SVG ikonrendszer automatizálásához. Ehhez egy SVG-vel teli mappa kell, és CSS fájlba dolgozza fel őket. Egy csomó választó van ott, az SVG képek fájlnevei alapján, amelyek rendelkeznek background-imageaz SVG adatok URI-jával (bár nem Base64).
Ilyen módon azt jelenti, hogy megkapja az SVG méretezhetőségét és a fájlméret előnyeit, de ennyi. Ennek ellenére gyakran csak erre van szükséged.
A Grunticonról talán az a legjobb, hogy mindent megad neked, ami a visszalépéshez szükséges. Ez magában foglal egy alternatív stíluslapot az adat URI PNG-k és még maguk az egyes PNG-k számára is (amelyeket az Ön számára hoz létre). Ráadásul egy szkript, amelyet az oldalon használ a támogatás meghatározásához, és csak a megfelelő stíluslapot tölti be.
Úgy gondolom, hogy méltányos azt mondani, hogy ez egyelőre könnyebben kezelheti a visszaeséseket, mint a defs / technika. Nem mintha lehetetlen.
A Grumpicon a Grunticon böngészőben található változata, amelyet ebben a képernyőn használtunk.
A Grunticon, ahogy ezt írom, azon dolgozik, hogy fokozatosan javítsa a beágyazott, inline SVG-t, ami nagyon jó lenne!