Могу ли я использовать селектор first-child в этом сценарии?

Question

Мои code:

<div class="allegati-item"> 
    <div class="allegati-titolo">Download</div> 
    <a class="allegati-link" href="/documenti/DocumentoTest.pdf">Link1</a> 
    <a class="allegati-link" href="/documenti/DocumentoTest.pdf">Link2</a> 
</div> 

.allegati-link 
{ 
    border-top:1px solid #FF0000; 
    display:block; 
    margin-bottom:4px; 
} 

.allegati-item a.allegati-link:first-child 
{ 
    border:0; 
}​ 

Я хочу удалить границу первого allegati-link элемента, но так как есть DIV перед ним, внутри allegati-item, кажется, что это не может быть возможно?

Answer 1

Вы можете попробовать это вместо:

.allegati-item .allegati-titolo + a.allegati-link{ 

Answer 2

Использование :first-of-type вместо или

.allegati-item > .allegati-titolo + a 

Последняя версия имеет несколько лучшую поддержку браузера (с IE7 на) в то время как первый один меньше зависит от вашего разметки.

Answer 3

premising что :first-of-type, вероятно, лучший выбор, вот еще одна альтернатива для браузера, который не поддерживает еще что pseudoclass

.allegati-link { border: 0; } 
.allegati-link + .allegati-link { border-top: ...} 

делает так что вы будете удалить границу только с первой ссылки.

Answer 4

Вы можете это также

$(".allegati-titolo").next().attr("style", "border-top:0px; display:block; margin-bottom:4px;"); 

Это будет первым выбрать следующий элемент сНа, имеющий класс = «allegati-titolo», а затем применить стиль к 1-ой линии.