Cara Membuat CSS Sprite Image

Contoh CSS sprite pada blog atau website self hosting, CSS Sprite digunakan untuk memperkecil query HTTP request atau permintaan http, jadi dengan membuat CSS Sprite blog atau website akan terasa lebih cepat loadingnya,
contoh CSS sprite sebagai berikut:
#navlist{position:relative;}
#navlist li{margin:0;padding:0;list-style:none;position:absolute;top:0;}
#navlist li, #navlist a{height:44px;display:block;}

#home{left:0px;width:46px;}
#home{background:url('img_navsprites.gif') 0 0;}

#prev{left:63px;width:43px;}
#prev{background:url('img_navsprites.gif') -47px 0;}

#next{left:129px;width:43px;}
#next{background:url('img_navsprites.gif') -91px 0;}

untuk praktek langsung silahkan langsung kesini: css sprite generator

One Response to Cara Membuat CSS Sprite Image

  1. riosetoblog mengatakan:

    yah kalau saja ada contohnya asyik juga, menarik lho bikin css sprite.

Tinggalkan Komentar

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s