Nädala tasuta paketid: 12 tasuta CSS Sprite-generaatorit
CSS-i pildipritsid võimaldavad dramaatiliselt vähendada saidi HTTP-taotluste arvu, ühendades paljud või kõik saidi kujutised ühte faili. Seda faili saab seejärel kasutada koos CSS-i taustpositsioonimisega üksikute piltide rakendamiseks.
Selle tehnika miinus on see, et see on vaevarikas ja kaasatud protsess, mis nõuab, et te kõik pildid korralikult kuvataks, et need käsitsi ühendada ja CSS-iga viidata. Õnneks on mitmeid tasuta veebitööriistu, mis selle protsessi täielikult automatiseerivad. Täna on meil neist kaheteistkümnest tööriistast fantastiline kollektsioon, millest igaühel on oma ainulaadne roll sprite genereerimise protsessil. Ükskõik, kas soovite luua piltide kaustast sprinti või olemasolevat saiti teisendada, on meil olemas tööriistad, mis aitavad teil töö sekunditega tehtud.
CSS Sprite Generator: projekti fond
Hea generaator rohkete võimalustega. Laadite üles .ZIP kõigi piltide hulgast, mille soovite muuta spriteiks ja see hoolitseb ülejäänu eest. See sülitab pildi ja kõik erinevad taust-positsiooni väärtused, mida vajate.
CSS Sprites generaator
Inetu ja lollakas see spritegeneraator sunnib teid iga pildi eraldi üles laadima. Proovige järele, et näha, mida arvate, kuid ausalt, selles nimekirjas on paremaid alternatiive.
CSS Sprites - veebipõhine CSS Sprite ehitaja / generaator
See on päris kena. Saate hõlpsasti üles laadida hunniku pilte korraga, valida väljundfaili ja isegi valida, kas saada selle tulemusel kas Sassi ja CSS-i kood. Hõljumiefektide automaatseks genereerimiseks on ka mõned täpsed võimalused, näiteks desatureeritud ja klappitud. Üldiselt üsna muljetavaldav, kontrollige seda kindlasti.
Spritebox - looge Sprite Imagesist CSS
See marsruut kulgeb erineval, pisut vähem automatiseeritud teel. Teie jaoks sprite-pildi loomise asemel võimaldab see teil juba loodud sprite-faili üles laadida ja määratleda konkreetsed alad, et tekitada CSS. Suurepärane tööriist, kui eelistate Photoshopis spreid luua ja soovite lihtsalt koodi abil abi.
Lõuend: CSS Sprites Generator
Kui laadite selle pildi jaoks pilte üles, peate seda tegema ükshaaval, mis on natukene valus. Kui teil on lingid, saate lihtsalt kleepida vastavate klasside nimedega loendisse ja teil on hea minna. Valikute hulka kuuluvad polster ja taustavärvid. See töötas minu testimisel hästi, tasub kindlasti vaatamist.
Õmblused - HTML5 sprite-lehe generaator
See võimaldab teil pilte lohistada, mis on fantastiline pärast kõigi muude arendajate poolt välja töötatud ebamugavate lahtilaadijate kasutamist. Pärast seda võite pildi saamiseks klõpsata lihtsalt ühel nupul ja CSS-i haaramiseks teisel nupul. Valikuid praktiliselt pole ja see töötab ainult Chrome'is ja Firefoxis, kuid see on täiuslik, kui soovite lihtsalt kiiret ja lihtsat lahendust.
Spritemapper
See on mõeldud ainult supernurkadele. See on allalaaditav spritegeneraator, mida käitate käsurealt. Teostus on siiski väga libe, osutate selle lihtsalt oma olemasolevale CSS-failile ja see teeb kogu ülejäänud töö. See teeb pikaajalise spritehalduse probleemiks käkitegu, kuna saate lihtsalt oma algsed css- ja pildifailid riputada ja muutuste korral neid uuesti töödelda.
SpriteMe
SpriteMe on vinge tööriist, mis võimaldab teil oma tüüpilist arendusprotsessi taktitundeliselt täielikult hoida. Ehitage oma leht lihtsalt nii, nagu tavaliselt teete üksikute piltide abil. Kui olete lõpetanud, avage leht brauseris ja klõpsake SpriteMe järjehoidja. See haarab kõik lehel olevad pildid, loob sprite ja genereerib CSS-i. See on eriti kasulik, kui konverteerite väljuvat saiti.
Spritefy
Spritefy on veel üks võimalus, mis võimaldab teil lihtsalt töödelda hunniku faile brauserisse, et neid töödelda. Nagu õmbluste puhul, pole tegelikult mingeid võimalusi, kuid see on kindlasti ülikiire viis spritsidega (ainult Chrome ja Firefox) kasutamiseks.
CSS Sprite Generaator
Sellel on genereerimis- ja seadistamisprotsessis mõned ebavajalikud sammud, nii et see võtab mõne sekundi kauem kui enamus teisi alternatiive, kuid sellel on palju koodi väljundit, mis sisaldab nii CSS-i kui ka HTML-i koos erinevate lõikudega iga pildi lisamiseks div või span, linkide sisestamine jne.
SpriteMeister - automaatne CSS Sprite generaator
SpriteMeister on palju nagu eespool SpriteMe, ainult vähem automatiseeritud. Järjehoidja kasutamise asemel laadite iga pildi ja praeguse CSS-faili käsitsi üles ning saate seejärel allalaaditud faili koos värskendatud koodi ja ühe pildiga.
Sprite Looja 2.0
See töötab täpselt nagu ülaltoodud Spritebox. Laadite üles mujal loodud sprite-pildi ja kasutate lihtsat valikuprotsessi, et genereerida igale pildile sobiv CSS.
Armastan seda? Jaga seda!
Kui teile meeldis selle nädala tasuta pakkumine, jagage armastust ja saatke link oma lemmiksaitidele. Siin on mugav katkend, mille soovite soovi korral kopeerida ja kleepida!
12 tasuta CSS Sprite-generaatorit: http://goo.gl/NhLNR
