Question

我现在在这个网站上工作，并且无法弄清楚为什么这不起作用.. 我希望在每个controlnav链接的底部和顶部放置小边框（见幻灯片的右侧），如果任何人有任何指针它会很棒...... http://limerickfc.hailstormcommerce.com/cms/

.nivo-controlNav a + a {
border-top: 1px solid #000000;
}

为了清晰起见，我会再加一点css，这样你就可以看到我在说什么......

.nivo-controlNav {
text-align:center;
position:absolute;
right:-180px;
height:474px;
width:180px;
top:0px;
z-index:8;
}

.nivo-controlNav a {
cursor:pointer;
height:68px;
padding: 13px 20px;
width:140px;
display:block;
background: url('http://limerickfc.hailstormcommerce.com/cms/wp-content/themes   /limerickfc/images/slideshowBg.jpg') scroll 0 0 transparent;
background-repeat: repeat-y; 
color: #6ED5FF;

}

谢谢！

Answer 1

使用Firebug查看附加页面后，您可以在内联样式表中声明此样式

#slider a {
    border: 0 none;
    display: block;
}

如果删除边框：0无;边框将出现，它正在覆盖你的NivoControlNav样式。

Answer 2

有两个违规的CSS规则

.nivoSlider a {
    border:0;
    display:block;
}

您的选择器.nivo-controlNav a + a的特异性略高于.nivoSlider a，因此您的选择器应该胜出。但是，也有这条规则：

#slider a {
    border:0 none;
    display:block;
}

此规则中的ID使其比您的更具特异性。从此规则中删除border属性，或向选择器添加ID以使其更具特异性。

更多关于CSS selector specificity。

css问题，nivo controlnav边框没有出现

2 个答案: