masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > html tutorial > css sprite的实现_html/css_WEB-ITnose

css sprite的实现_html/css_WEB-ITnose

WBOY
Lepaskan： 2016-06-24 11:42:53
asal
969 orang telah melayarinya

css sprite

为什么使用css sprite？

网页上的很多静态小图片在加载时需要大量http请求，增加了响应时间。（哈哈，雅虎34条优化法则的第一条啊）

css的background-position:x,y;


利用分层实现

1、设置块状元素大小

2、改变背景的位置

3、实现(很多小图组成的大图)对应位置小图的出现


自动生成css sprite的工具：cssgaga

Label berkaitan：
css sprite的实现
sumber：php.cn
Artikel sebelumnya：Atitit.ui控件-下拉菜单选择控件的实现select html_html/css_WEB-ITnose Artikel seterusnya：css3 字体旋转_html/css_WEB-ITnose
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?
daripada 2024-04-23 00:22:19
0
9
1588
Menggunakan Grid untuk Mencipta Reka Bentuk Khusus Ini: Panduan Langkah demi Langkah Saya cuba membuat reka letak yang serupa dengan imej ini, saya telah cuba menggunakan grid...
daripada 2024-04-06 20:29:08
0
2
492
Cara menggunakan komponen laravel dengan ruang letak malas livewire Saya ingin menambah rangka komponen laravel saya di dalam ruang letak livewire3 Perkara ya...
daripada 2024-04-06 20:02:10
0
2
543
Bagaimana untuk mengumpulkan dan mengira dalam MySQL? Saya cuba menulis pertanyaan yang mengekstrak jumlah bilangan mesej yang tidak dipadam yan...
daripada 2024-04-06 18:30:17
0
1
353
Titik Scatterplot tidak mengekalkan nilai semasa mengezum masuk d3.js Ini adalah kali pertama saya menggunakan d3.js, jadi harap bersabar. Saya melaksanakannya ...
daripada 2024-04-06 18:16:26
0
1
403
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan