说我有CSS：选择器不适用于不同的标签？

<div class="myClass"> 
    <div class="child"></div> 
    <span class="child"></span> 
    <a class="child"></a> 
</div>

如果我使用

.child:first-of-type { /* Code here */ }

然后，所有三个标签获得的CSS代码，因为它们都是不同的类型。有没有办法仍然使用这个选择器，但有不同的标签？

来源

2013-08-25 Kousha

可能重复：？http://stackoverflow.com/questions/2717480/css-selector-for-first - 元素，用一流 – aug

demo

第一的类型来选择它的类型，但你定义的每一个孩子不同的类型。在演示中，我提供了另外两个div（of-type），其中第一个div被选中，另一个（of-type）是跨度，这是只有一个，所以它选择是否添加更多的跨度，然后它不会'选择其他跨度。

在你的情况，如果你想只选择第一再申请:first-child

的：首个型CSS伪类表示它的类型在其父的孩子列表中的第一个兄弟元件。从MDN采取source

实施例提供的源上方

div :first-of-type { 
    /*background-color: lime;*/ 
    font-weight: bold; 
} 


<div> 
    <span>This span is first!</span> 
    <span>This span is not. :(</span> 
    <span>what about this <em>nested element</em>?</span> 
    <strike>This is another type</strike> 
    <span>Sadly, this one is not...</span> 
</div>

结果：

这跨度第一！这个跨度不是。 :(你看这个嵌套元素这是另一种类型的可悲的是，这个人是不是...

来源

2013-08-25 04:00:52

只需将标签添加到选择器，例如，

div.child:first-of-type { /* Code here */ }

来源

2013-08-25 03:53:14 Musa

From docs:

伪类:first-of-type

的:first-of-type伪类表示是其在它的父元素的子元素的列表类型的第一个同级元素。与:nth-of-type(1)相同。

语法

selector:first-of-type{ properties }

来源

2013-08-25 03:58:15

CSS：选择器不适用于不同的标签？

回答

demo

相关问题