CSS中背景定位background-position負(fù)值一直是不好理解的難點(diǎn)，一方面用的比較少，另一方面的理解的不夠深入，今天花了點(diǎn)時(shí)間認(rèn)真的思考了，把我的心得寫出來．
　　下面是我要用到的一個(gè)背景圖：


　　運(yùn)行下面代碼：


　　HTML頁中是162*162的灰色背景DIV塊并加入三種不同位置的背景圖片，
　　在瀏覽器中看到的效果：


　　從上圖可以看到：當(dāng)為background-position:0 0;時(shí)圖片的左上角與DIV的左上角是重合的，當(dāng)我們定位于background-position:-50px -50px;時(shí)發(fā)現(xiàn)圖片向左上，移動(dòng)了，也就以DIV的左上角為中心，圖向左移動(dòng)了50PX，向右也移動(dòng)了50PX．第三個(gè)示例就是上值的情況圖移動(dòng)的效果．這個(gè)應(yīng)該是好理解的．
　　總結(jié)一下就是以上都是以DIV的0，0點(diǎn)為參考點(diǎn)圖片移動(dòng)，假如把DIV區(qū)解釋為一個(gè)坐標(biāo)軸，圖向左，上都為負(fù)，向右，下為正值．

　　好象說這么多你也記不住，那我就告訴你，你應(yīng)該記住什么吧！

　　在實(shí)踐中多數(shù)情況是知道一個(gè)圖的位置要如上圖中那個(gè)黃色的點(diǎn)，我們應(yīng)該在效果圖上量出它的長(zhǎng)度得出兩個(gè)值都是150PX,那我們定義圖的位置就要寫background-position:-150px -150px;這樣就定義好了,在圖上的量法就看下圖（這張圖相當(dāng)于你用的效果圖或稱設(shè)計(jì)圖），記住這張圖相信你一定能把握背景圖負(fù)值的方法了


　　本文作者：purecss