jQuery/CSS - Bir elemanın ilk oluşumunu başka bir elemanın içinde nasıl şekillendirirsiniz?

Question

İşte benim problemim.

HTML

<div id="content"> 
    <h1>Headline</h1> 
    <p>First paragraph that needs to be yellow.</p> 
    <p>Second paragraph that need not change. :) </p> 
    <p>Third paragraph that need not change. :) </p> 
</div> 

Ben pcontent birinci çocuk olmadığı için çalışmıyor #content p:first-child {color:yellow; } kullanıyorsanız ... h1 ilk doğan olduğunu.

HTML koduna dokunmadan bunu nasıl yapabilirim?

Teşekkür ederiz!

Tüm iyi, Cris yerine

Answer 1

Bu en iyi yoludur: sadece CSS ile

$('#content p:first').css('color', 'yellow'); 

Answer 2

Kullanım .first() fonksiyonu (veya :first seçici):

jQuery kullanarak etiketledi yana

$('#content > p').first().css('color', 'yellow'); 

Answer 3

, jQuery tabanlı çözüm:

$ ("# content p: first-child"). css ({color: "sarı;"});

DÜZENLEME:

$("#content p:nth-child(2)").css({color:"yellow" }); 

Answer 4

, bunu böyle kardeş seçicisi + kullanabilirsiniz:

#content h1 + p { color: yellow; } 

Bu olur Sadece H1’leri takip eden paragrafları değiştirin.

Answer 5

<script> 
$(function(){ 
    $('#content p:first').css('color','yellow'); 
}); 
</script> 

Answer 6

$('#content p').first().css({ color: 'yellow' }); 

Answer 7

bu deneyin:

$("div p:first") 
     .css("text-decoration", "underline") 
     .hover(function() { 
       $(this).addClass("sogreen"); 
      }, function() { 
       $(this).removeClass("sogreen"); 
      }); 

Answer 8

de kullanabilirsiniz (CSS, jQuery) nth-of-type:

#content p:nth-of-type(1) {color:yellow; } 

$('#content p:nth-of-type(1)').css('color', 'yellow'); 

Answer 9

bir css3 çözüm

#content > p:first-of-type { color: yellow; }