款瞄准一个div

我这行的HTML代码中：款瞄准一个div

<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>

我怎么会只针对第一项或第三只一个改变颜色，字体等？

来源

2014-01-30 SmalliSax

通过编写一些代码？ – undefined

http://reference.sitepoint.com/css/pseudoclass-nthchild –

你有没有写第三届一个意味着第三div只有改变颜色比你需要使用

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

因此，使用上述选择，具有#slideshow2一个id我选择元素，然后我选择第三号直接子div，并在结束我选择p元件，其是一个直接子到第三div

Demo

来源

2014-01-30 11:53:23

完美地工作。 +1 – Nitesh

@NathanLee谢谢matey .. –

谢谢你的回答，它的工作原理就像它应该。 – SmalliSax

的第一p只能

p:nth-child(1) { }

p:nth-child(3) { }

...怎么做呢？

来源

2014-01-30 11:54:36 Patrick

这将无法正常工作，我不知道它是如何投票的，而且仅仅在30秒内 –

您能否提供一个小提琴@patrick来证明您的答案？ – Nitesh

嗯，是的，这是行不通的，我写了没有测试它的基本用法的第n个孩子选择器。我的错。这只有当它是这样的时候才有效：http://jsfiddle.net/D6C7e/4/ – Patrick

尝试使用nth-child css选择器。

您的情况，请尝试此目标在slideshow2 div内的第3段。

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

你可以找到更多的花样来定位你的选择还是第n个孩子的这里的元素：http://nthmaster.com/

希望这有助于！

来源

2014-01-30 11:59:10

首先，选择第三个div，其语法如下： div:nth-of-type(3){ } /*这意味着您正在选择第三个div内的所有内容。 */

如何，如果你想选择2rd p的第三格，即使你没有第二个p在你的问题。你会做的语法是这样的：

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

怎么做呢？

来源

2017-09-15 23:27:23 wacKY

款瞄准一个div

回答

相关问题