Css sprite: resize small and medium-sized icons in a large image

Css sprite: resize small and medium-sized icons in a large image

Solution:

Assume that the size of a combined big image is 900x1000 px (for example)

Now you want to take the hippo icon in the upper-left corner of the graph and narrow down the Icon size. <Strong? Http: www.bkjia.com kf ware vc "target =" _ blank "class =" keylink "> VcD4KPHA + 1f2zo8ihzbyjuw.vcd4kpha + PC9wPgo8cHJlIGNsYXNzPQ = "brush: java;">. sprite {background: url ('imgs/woqu_localjoin_all.png ') no-repeat-21px-80px; width: pixel PX; height: 154px ;}
Now take half of the normal Icon size:

. Sprite {background: url('all.png ') no-repeat-10px-40px; width: 95px; height: 74px; background-size: pixel PX 500px ;}



OK, all done!


Finally, we recommend a css sprite measurement tool: http://www.spritecow.com/
Open and drag the assembled png image into it: