Hierdie instrument stel jou instaat om outomaties CSS sprites te genereer. Gee dit net `n ZIP leêr wat 2 of meer beelde (GIF, PNG of JPG) bevat, en dit sal `n sprite beeld genereer met die ooreenstemmende CSS reëls om na elke komponent beeld te verwys en te wys.

Opsies

Die instrument het `n paar opsies wat jy kan konfigureer om sekere eienskappe van die gegenereerde sprite beeld en CSS te laat pas by die spesifikasies van jou webblad. Die opsies is hier onder uitgelig:

Verstel bron beeld groottes

Breedte & Hoogte
As die breedte of hoogte gestel word na minder as 100% sal die bron beelde verstel word in grootte voor dit gekopieer word na die uitset beeld. Die instrument sal jou nie toelaat om `n waarde meer as 100% te verskaf nie, omdat vergroting van beelde `n gehalte verlies tot gevolg sal he. Die initieele waarde vir beide breedte en hoogte is 100% (geen verstelling).

Beeld Duplikate

Ingoreer duplikaat beelde
Duplikaat beelde is gekopieer na die uitset beeld en aparte CSS reëls is geskep vir elke duplikaat.
Verwyder duplikaat beelde maar verenig klasse
Die instrument vergelyk `n MD5 van die inhoud van elke beeld om op `n akkurate wyse te bepaal of beelde duplikate van mekaar is binne die ZIP. Hierdie duplikate is verwyder en CSS reëls vir hierdie duplikate word saamgepers tot een reël.

Sprite Uitset Opsies

Horisontale Afset
Hierdie determineer die horisontalie spasiering tussen rye van beelde in die uitset. Hierdie waarde moet groot genoeg wees om die Safari agtergrond herhaling gogga oplossing in ag te neem. Ons beveel aan om by die initieele waarde te bly.
Vertikale Afset
Hierdie determineer die vertikale spasiering tussen elke opvolgende beeld. Dit behoort groot genoeg te wees om gebruiker lettertipe grootte verstellings in ag te neem. Oor die algemeen beveel ons aan dat jy jou webblad so ontwerp dat gebruikers hul lettertipe grootte ten minste kan verdubbel voor die volgende agtergrond beeld sigbaar word.
Agtergrond Kleur
Stel `n agtergrond kleur vir die uitset beeld. Hierdie veld neem `n 6 letter heksadesimale waarde. As te lank en as die uitset formaat op GIF of PNG gestel is, sal die agtergrond deursigtig wees
Sprite Uitset Formaat
Ondersteun GIF, PNG en JPG. GIF en PNG kan deursigtige agtergronde he. Die initieele waarde is PNG.

CSS Uitset Opsies

CSS Voorvoegsel
Elke CSS posisie reël gegenereer is met hierdie teks voorgevoeg. Voorvoeging van basiese id en klass selektors is geondersteun. Die volgende karakters word toegelaat - a-z, 0-9, _, -, # and .
Leêrnaam Patroon Toets
Enige korrekte taal formule (regular expression) kan gebruik word. Gebruik geronde hakkies rondom die seksie van die toets wat jy graag as uitreksel van die leêr naam van elke beeld wil he. Dit sal gebruik word as die basis van die posisionerings klas name.
Klas Voorvoegsel
Die teks ingevoer sal voorgevoeg woord voor elke gegenereerde klas naam. Dit is van kardinale belang om hierdie te spesifiseer waar die gegenereerde klas name andersins met `n nommer sou begin, aangesien nommers nie korrekte selektore is nie (soos gedefinieer deur W3C aanbevelings). Die volgende karakters word toegelaat - a-z, 0-9, _ and -. Die voorvoegsel kan nie met `n nommer begin nie.
CSS Agtervoegsel
Die teks ingevoer sal aan die einde van elke CSS reël bygevoeg word. "CSS Agtervoegsel" laat die selfde karakters as "Klas Voorvoegsel" toe.