---
tags: Css, Rwd
---
# CSS nth-child 選擇器
###### tags: `css`
#### HTML

<div class="box">
    <p class="aa">aaaaaaaaaaaa</p>
    <span class="bb">bbbbbbbbbbbb</span>
    <div class="cc">cccccccccccc</div>
    <p class="aa">aaaaaaaaaaaa</p>
    <span class="bb">bbbbbbbbbbbb</span>
    <div class="cc">cccccccccccc</div>
    <p class="aa">aaaaaaaaaaaa</p>
    <span class="bb">bbbbbbbbbbbb</span>
    <div class="cc">cccccccccccc</div>
</div>

---

#### CSS

.box div:nth-of-type(1) {
    color: red;
    font-size: 24px;
}

.box .cc:not(.cc ~ .cc) {
    color: red;
    font-size: 24px;
}

.box .cc:nth-child(1 of .cc) {
    color: red;
    font-size: 24px;
}
.box .cc:nth-child(2 of .cc) {
    color: bule;
    font-size: 30px;
}