1.1 选择除第一个元素后面的所有元素,可通过
:nth-child(n + 2)
实现
html页面
<div class="titContant">
<div>合同编号:xxx454136541353413</div>
<div>订单编号:xxx235463126413646</div>
<div>创建人:xxxzm</div>
<div>所属分公司:xxx有限公司</div>
<div>创建时间:2021.05.04</div>
<div>合同状态:生效中(未生效)</div>
</div>
css页面
.titContant div:nth-child(n + 2) {
//n+2就是从第二个元素开始往后所有的元素
padding-left: 50px;
color: cornflowerblue;
}
页面展示
1.2 选择除最后一个元素前面的所有元素,可通过
:not(:last-child)
实现
.titContant div:not(:last-child) {
//:not(:last-child)就是除最后一个前面所有的元素
padding-left:50px;
color: cornflowerblue;
}
页面展示
1.3 只选择最后一个元素,可通过
:last-child
实现
.titContant div:last-child {
//:last-child选择最后一个元素
padding-left:50px;
color: cornflowerblue;
}
页面展示
1.4 只选择第一个元素,可通过
:first-child
实现
.titContant div:first-child {
//:first-child就是选择第一个元素
padding-left:50px;
color: cornflowerblue;
}
页面展示
1.5 选择某一个元素,可通过
:nth-child(n)
实现
.titContant div:nth-child(3) {
//:nth-child(3)括号里面的数字就是你想要选择控制的元素
padding-left:50px;
color: cornflowerblue;
}
页面展示