Css选择器
1.选中某一个赋给样式
HTML
<div class="box">
0
<div>1</div>
<div>2</div>
<div>3
<div>3.1</div>
<div>3.1</div>
</div>
</div>
<div class="box">
0
<div>1</div>
<div>2</div>
<div>3
<div>3.1</div>
<div>3.1</div>
</div>
</div>
css
div {
border: 2px solid #9c9c9c;
margin: 5px;
padding: 5px;
box-sizing: border-box;
font-size: 20px;
font-weight: 600;
color: aliceblue;
}
.box {
background-color: red;
}
.box>div:nth-child(1) {
background-color: blueviolet;
}
.box>div:nth-child(2) {
background-color: yellowgreen;
}
.box>div:nth-child(3) {
background-color: black;
}
.box>div:nth-child(3)>div:nth-child(1) {
background-color: blue;
}
.box>div:nth-child(3)>div:nth-child(2) {
background-color: #9c9c9c;
}
div {
border: 2px solid #9c9c9c;
margin: 5px;
padding: 5px;
box-sizing: border-box;
font-size: 20px;
font-weight: 600;
color: aliceblue;
}
.box {
background-color: red;
}
.box>div:nth-child(1) {
background-color: blueviolet;
}
.box>div:nth-child(2) {
background-color: yellowgreen;
}
.box>div:nth-child(3) {
background-color: black;
}
.box>div:nth-child(3)>div:nth-child(1) {
background-color: blue;
}
.box>div:nth-child(3)>div:nth-child(2) {
background-color: #9c9c9c;
}