在CSS中的背景位置的正確距離

我曾在一個CMS上工作，我想爲不同的按鈕進行特殊編輯。我創建了一個小examplefile至極看起來是這樣的：在CSS中的背景位置的正確距離

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xml:lang="de" lang="de" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>demo</title> 
<style> 
/* --- "breadcrumbs" --- */ 
ul.path   {margin:0; 
       padding:0; 
       padding-bottom:19px; 
       zoom:1; 
       overflow:hidden;} 
ul.path li  {list-style-type:none; 
       list-style-position:outside; 
       height:28px; 
       overflow:hidden; 
       float:left; 
       margin-right:2px; 
       font-size:85%; 
       padding-left:10px; 
       line-height:19px; 
       background:url(hor.png) no-repeat left -90px;} 
ul.path li.cur {padding-left:10px; 
       background:url(hor.png) no-repeat left -60px;} 
ul.path a  {padding:0 15px 0 0; 
       overflow:hidden; 
       float:left; 
       font-weight:normal; 
       height:26px; 
       padding-top:2px; 
       color:#fff; 
       text-decoration:none; 
       background:url(hor.png) no-repeat right -90px;} 
ul.path li.cur a {color:#FFF; 
       font-weight:bold; 
       background:url(hor.png) no-repeat -180px -60px;} 
</style> 
</head> 
<body> 
<ul class="path"> 
    <li><a href="#">Webdevelopment</a></li> 
    <li><a href="#">programming</a></li> 
    <li><a href="#">database</a></li> 
    <li><a href="#">modeling</a></li> 
    <li class="cur"><a href="#">Dezign</a></li> 
</ul> 
</body> 
</html>

我有一個PNG的背景圖像，看起來像這樣 Background images with tiffrent right corners http://img10.imageshack.us/img10/1849/hor.png 結果看起來是這樣的： result http://img21.imageshack.us/img21/774/resultr.png 的目標是獲得一個不同勢右側角球，但我試圖設置一個負面的距離不工作。能否給我一個解釋？更多有趣的可以somone給我一個解決方法，修復類cur錯誤？

來源

2009-10-11 Lara Röpnack

我認爲你應該在http://doctype.com/上提問你的CSS問題。 – Tarik 2009-10-11 09:01:37

*應該問.... – Tarik 2009-10-11 09:08:28

那是因爲你設置了一個負距離，在第一個背景的中間給你一塊。如果使用像-250px這樣的位置，則會變得更近，但要準確得到它，必須在鏈接上設置固定寬度，或者在所需背景位於右側邊緣的情況下使用圖像。

來源

2009-10-11 09:36:19 Guffa

哦，我檢查它與一個negetive邊緣了。結果是不幸的是一樣的。正確的解決方案是正確的。但是在這種情況下，我需要爲右角設置一個特殊的行，我的願望是讓erery color成爲一行，並且爲了讓ervery右轉角找到一個特殊的位置，在那裏我可以找到正確的角落。當我閱讀CSS Backgroundposition的規範時，我想，我可以給一個負值以達到右上角。但看起來，這不起作用。不幸的是。也許有人知道另一種解決方案。但是，謝謝你的答案。 – 2009-10-11 17:58:11

@Lara：即使您使用負位置，它仍然是元素左邊緣的位置。如果您不想爲元素指定寬度，則可用於指定右邊的唯一背景位置是「右」。所以，如果您不想指定寬度，唯一的解決方法是重新排列圖像，以便在圖像的右側獲得所有正確的邊緣。 – Guffa 2009-10-11 18:05:30

在CSS中的背景位置的正確距離

回答

相關問題