权重和伪类 - - php.cn博客

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        @import url('demo1.css');
    </style>
</head>
<body>
        <h1 class="demo1">你好实际二</h1>
        <div class="list">
            <div class="item">item1</div>
            <div class="item">item2</div>
            <div class="item">item3</div>
            <div class="item">item4</div>
            <div class="item">item5</div>
            <div class="item">item6</div>
        </div>
</body>
</html>

h1{
    color: red;
    font-size: 12px;
}
h1.demo1{
    font-size: 16px;
    color: green;
}
.item:nth-of-type(n+1){
    color: red;
}
.item:nth-of-type(n+2){
    color:green;
}