如何在这里正确实现nth-of-type？

Question

<div id="Main">
    <div id="sub">
        <section id="sub2">
            <div>1</div>
            <div>2</div>
            <div>3</div>
        </section> 
    </div>
</div>

当我尝试“div：nth-​​of-type（1）之前{content：”Foo：“;}”Foo正在所有div上输出。我明白为什么会这样。有没有办法在这周围进行锻炼，只输出div下的div？

编辑：我不能做第n节，因为我面临同样的问题。还有其他地方我也有节元素。

Answer 1

sub2应该是唯一的，所以：

#sub2 div:first-child::before{content: "Foo: ";}