資訊專欄INFORMATION COLUMN
摘要：精靈圖雪碧圖把一堆小圖片整合在一張大圖上，通過背景圖片相關設置背景圖片背景圖是否重復背景圖定位，顯示圖片，減輕服務器對圖片的請求數量優點減少網頁的請求，提高頁面性能圖片命名上的困擾更換風格方便缺點必須限定容器大小，符合背景圖片元素的位置，需
css sprites：精靈圖（雪碧圖）：把一堆小圖片整合在一張大圖上，通過背景圖片相關設置（背景圖片、背景圖是否重復、背景圖定位），顯示圖片，減輕服務器對圖片的請求數量
優點：
1、減少網頁的HTTP請求，提高頁面性能
2、圖片命名上的困擾
3、更換風格方便
缺點：
1、必須限定容器大小，符合背景圖片元素的位置，需要計算
2、維護比較麻煩
使用步驟：
1、制作一張具有多狀態的拼合圖片，需要按照一定規律處理
2、給要顯示背景的盒（一個固定尺寸，寬width、高height），以背景的方式加載，讓其局部顯示
3、通過背景圖定位（background-position）控制不同的顯示狀態
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/1905.html
摘要：它是基于，由聯盟進行開發的。是一種采用來描述二維圖形的語言這個大家都知道，那么元素是什么呢單純翻譯的話，是符號的意思，然我的理解是元素用來定義一個圖形模板對象，它可以用一個元素實例化。 showImg(https://segmentfault.com/img/bVbhAl9?w=1278&h=722); 大家好，這里是@IT·平頭哥聯盟，我是首席填坑官——蘇南(South·Su)，...
摘要：以上，從分層組織，模塊化，使用時注意低權重原則，以及巧用雪碧圖闡述了提高代碼質量的四個方面。編寫高質量代碼前端開發修煉之道曹劉陽 分層組織CSS 我們應用CSS的能力應該分成兩部分：一部分是CSS的API，重點是如何用CSS控制頁面內元素的樣式；另一部分是CSS框架，重點是如何對CSS進行組織。 推薦一種組織CSS的方法： base.css + common.css + page.c...
摘要：編寫配置文件，以下是關鍵配置代碼雪碧圖合并輸出到文件參數執行目錄參數生成的和圖片的文件名之所以推薦，是因為非常的靈活，看懂模塊的可以根據你的項目情況編寫對應的配置文件。 showImg(https://segmentfault.com/img/bVGpAw?w=518&h=156); 前言 網站開發90%會用到小圖標， 多小圖標調用顯示是前端開發常見的問題；目前小圖標顯示常見有兩種方式...
摘要：什么是打開一些網站可以看到每張圖片相應需要請求一次后臺，如下圖請求是比較消耗資源的，當網站中存在較多的請求時，性能就會相應的降低，加載就會變慢，甚至卡住。減少請求能提高性能，就是通過合并多張圖片達到減少請求目的的一種技術。 什么是css sprites? 打開一些網站可以看到每張圖片相應需要請求一次后臺，如下圖： showImg(http://segmentfault.co...
閱讀 1802·2021-11-24 09:39
閱讀 2290·2021-09-30 09:47
閱讀 4144·2021-09-22 15:57
閱讀 1873·2019-08-29 18:36
閱讀 3577·2019-08-29 12:21
閱讀 590·2019-08-29 12:17
閱讀 1263·2019-08-29 11:25
閱讀 724·2019-08-28 18:26
