nth-child的问题

跟着视频教学打的，为什么数字是3，而不是1
######

    #div0 label:nth-child(3) {
        flex: 0 0 25px;
    }

<div id="div0">
    <label>姓名</label>
    <input type="text">
    <label>GO</label>
</div>

我的理解的话3的话是抓取的第三个元素内容是go，但是实际生效的是第一个姓名内容。为什么会这样

应该不会你是不是 <label>姓名</label>前面还有两个元素

你发下完整代码看看

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title> 页面名称 </title>
<style type="text/css">
    #div0 label:nth-child(1) {
        color: blue;
    }

    #div0 label:nth-child(3) {
        color: red;
    }

</style>
</head>
<body>

<div id="div0">
    <label>姓名</label>
    <input type="text">
    <label>GO</label>
</div>

</body>
</html>

img

label:nth-child(3)是判断出于第三个位置的并且是label标签才生效

img

<style>
    #div0 label:nth-child(1) {
        background: green
    }
    #div0 input:nth-child(2) {
        background: yellow
    }
    #div0 label:nth-child(3) {
        background:#f00
    }
</style>
<div id="div0">
    <label>姓名</label>
    <input type="text">
    <label>GO</label>
</div>