Le ciblage de paragraphe à l'intérieur d'un div

J'ai cette ligne de code HTML:

<div id="slideshow2">
  <div class="active2">
    <img src="noangel.png" alt="Slideshow Image 1" />
    <p class="imgDescription2">NoAngel</p>
  </div>
  <div>
    <img src="anders.png" alt="Slideshow Image 2" />
    <p class="imgDescription2">This is Anders</p>
  </div>
  <div>
    <img src="fayeblais.png" alt="Slideshow Image 3" />
    <p class="imgDescription2">Something about FayeBlais</p>
  </div>
  <div>
    <img src="ronny.png" alt="Slideshow Image 4" />
    <p class="imgDescription2">Ronny Information</p>
  </div>
</div>

Comment j'ai cibler le premier alinéa, ou à la 3ème, seulement pour changer la couleur, le type de police, etc ?

En écrivant du code?
reference.sitepoint.com/css/pseudoclass-nthchild

OriginalL'auteur SmalliSax | 2014-01-30

  1. 8

    Avez-vous signifié troisième div par écrit 3ème plus qu'à changer la couleur que vous devez utiliser

    #slideshow2 > div:nth-of-type(3) > p {
   /* Styles */
}

    Donc ci-dessus en utilisant le sélecteur d'suis en sélectionnant l'élément ayant l'id #slideshow2 puis-je sélectionner le troisième numéro direct de l'enfant div, et à la fin, je sélectionne le p élément qui est un enfant direct de la troisième div

    Démo

    Fonctionne parfaitement. +1
    Merci mon pote..
    Merci pour ta réponse, ça fonctionne comme il le devrait.
    Vous bienvenue 🙂

    OriginalL'auteur Mr. Alien

  2. 1

    Essayez d'utiliser nth-child sélecteur css.

    pour votre cas, essayez ceci pour cible 3e paragraphe à l'intérieur slideshow2 div.

    #slideshow2 p:nth-child(3) {color:blue; font-size:20px;}

    Vous pouvez trouver plus d'astuces pour cibler les éléments de votre choix ou nième childs ici: http://nthmaster.com/

    espérons que cette aide!

    OriginalL'auteur Freelance PHP Programmer

  3. 0

    pour la première p seulement

    p:nth-child(1) { }

    3ème 

    p:nth-child(3) { }

    ... l'obtenir?

    Cela ne fonctionne pas, je ne sais pas comment il est voté et que trop en seulement 30 secondes
    Pouvez-vous fournir un violon @patrick pour justifier votre réponse?
    hmm, oui, ce n'est pas de travail, j'ai écrit l'utilisation de base de nth-child sélecteurs sans le tester. Mon mauvais. Cela ne fonctionne que si c'était quelque chose comme ceci: jsfiddle.net/D6C7e/4

    OriginalL'auteur Patrick

  4. 0

    tout d'abord, sélectionnez 3ème div avec une syntaxe du type:
    div:nth-of-type(3){ }
    /* et cela signifie que vous êtes en sélectionnant tout à l'intérieur de 3ème div. */

    comment jamais, si vous souhaitez sélectionner 2 p de 3ème div même si vous n'avez pas 2 p dans votre question. vous ferez de la syntaxe ressemble à ceci :

    div:nth-of-type(3)>p:nth-of-type(2) { }

    l'obtenir?

    OriginalL'auteur wacKY