文章詳情頁(yè)
javascript - 這個(gè)雪碧圖是怎么生成的？
瀏覽：94日期：2023-05-20 17:09:53
問(wèn)題描述
https://s1.hdslb.com/bfs/stat...
比普通的圖片小很多。尺寸1600*2444但是只有70kb？品質(zhì)降低？還有開(kāi)發(fā)的時(shí)候這個(gè)排版是手動(dòng)一個(gè)一個(gè)弄的雪碧圖？還是靠i工具生成的
問(wèn)題解答
回答1：這張圖是8bit png（最大256色），對(duì)于色彩簡(jiǎn)單的圖可以用這種格式減少體積。
回答2：有工具，/a/11...
圖片壓縮可以用 gulp-imagemin。這樣就很容易在項(xiàng)目集成到工作流中。
現(xiàn)在貌似用雪碧圖的相對(duì)少了些，逐漸在用svg及icon font代替了。
回答3：一般是靠工具的。我一般用的CssSprite.exe,只用自己把圖片拖進(jìn)去，然后會(huì)給你生成雪碧圖以及對(duì)應(yīng)的css
回答4：CssSprite.exe也是要手動(dòng)拖進(jìn)去的
回答5：可以使用圖像編輯軟件如Photoshop將多張圖放到同一個(gè)圖層并導(dǎo)出或使用自動(dòng)化構(gòu)建工具自動(dòng)拼接合并后的圖片
標(biāo)簽：
JavaScript
上一條：javascript - vue v-for循環(huán)，子循環(huán)內(nèi)要取到父循環(huán)的鍵值，如何做到？下一條：javascript - webpack異步加載js問(wèn)題
相關(guān)文章：
1. 關(guān)docker hub上有些鏡像的tag被標(biāo)記““This image has vulnerabilities””2. Span標(biāo)簽3. css - 求推薦適用于vue2的框架 像bootstrap這種類型的4. docker-machine添加一個(gè)已有的docker主機(jī)問(wèn)題5. java - Collections類里的swap函數(shù)，源碼為什么要新定義一個(gè)final的List型變量l指向傳入的list？6. css - 關(guān)于div自適應(yīng)問(wèn)題，大家看圖吧，說(shuō)不清7. android新手一枚，android使用httclient獲取服務(wù)器端數(shù)據(jù)失敗，但是用java工程運(yùn)行就可以成功獲取。8. angular.js使用$resource服務(wù)把數(shù)據(jù)存入mongodb的問(wèn)題。9. redis啟動(dòng)有問(wèn)題？10. SessionNotFoundException：會(huì)話ID為null。調(diào)用quit（）后使用WebDriver嗎？（硒）
排行榜
熱門標(biāo)簽
網(wǎng)公網(wǎng)安備