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

© Copyright 2024 | computer06.com