Nivo背景位置正在被忽略

希望有人能幫我解決我的css背景定位在我正在實施的一個新設計的nivo滑塊上。Nivo背景位置正在被忽略

.nivo-nextNav被忽略的背景位置，我不明白爲什麼。

這裏是我的CSS：

/* Direction nav styles (e.g. Next & Prev) */ 
.nivo-directionNav a { 
display:block; 
width:43px; 
height:45px; 
background:url(../images/arrows.png) no-repeat; 
text-indent:-9999px; 
border:0; 
} 
.nivo-prevNav { 
left:0px; 
} 
.nivo-nextNav { 
background-position: -43px 0; 
right: 22px; 
}

鏈接到頁面：http://www.plumeriawebdesign.com/Headstand%20Software/

我現在的工作。我將.nivo-directionNav a的css更改爲以下內容：

.nivo-directionNav a { 
position:absolute; 
top:40%; 
z-index:9; 
cursor:pointer; 
width: 43px; 
height: 45px; 
text-indent:-9999px; 
background-image:url(../images/arrows.png); 
background-repeat: no-repeat; 
}

現在背景已正確定位。奇怪爲什麼它在他們的網站上的默認滑塊，而不是我的。對我來說很奇怪。

來源

2012-02-14 plumwd

您的背景位置設置爲.nivo-nextNav，但.nivo-nextNav沒有背景，鏈接確實存在; '.nivo-nextNav a'< -

最簡單的解決方案：把位置放在後臺;

.nivo-directionNav a { 
....... 
background:url(../images/arrows.png) -43px 0 no-repeat;

來源

2012-02-14 19:25:00 driedoezoe

它確實有背景。它是從'.nivo-directionNav a'繼承的。設置這個類的位置不會解決問題，因爲它需要爲'.nivo-prevNav'和'.nivo-nextNav'進行更改。 – plumwd 2012-02-14 19:31:43

background-position只定位背景圖像。但是.nivo-nextNav元素中沒有背景圖片。

從我看到NivoSlider使用箭頭這樣的：

.nivo-directionNav a { 
    display:block; 
    width:30px; 
    height:30px; 
    background:url(arrow.png) no-repeat; 
    text-indent:-9999px; 
    border:0; 
} 
a.nivo-nextNav { 
    background-position:-30px 0; 
    right:15px; 
} 
a.nivo-prevNav { 
    left:15px; 
}

嘗試使用錨標記在你的元素beggining。

來源

2012-02-14 19:41:41 Giannis

Nivo背景位置正在被忽略

回答

相關問題