能否使用CSS last-child伪类修改同class元素的边框大小？

当然可以！你根本不需要额外给第二个div加新类，CSS的:last-child伪类就是干这个事儿的——能精准选中父容器里最后一个带.border类的元素，直接调整它的边框尺寸就行。

原理简单讲 #

:last-child的作用是匹配父元素下的最后一个子元素，只要你的两个带.border的div是同一个父容器的直接子元素，这个方法就完美生效。

直接上代码示例 #

先看HTML结构（假设两个div放在同一个父容器里）：

<div class="container">
  <div class="border">第一个带边框的元素</div>
  <div class="border">第二个带边框的元素</div>
</div>

然后是CSS代码：

/* 你的基础.border类样式 */
.border {
  border: 3px solid black;
  width: 80px;
  display: inline-block;
  padding: 10px; /* 加个内边距让内容不挤 */
  margin: 0 5px; /* 加个外边距区分元素 */
}

/* 用:last-child选中最后一个.border元素，修改边框 */
.border:last-child {
  border-width: 1px; /* 把边框改小，比如改成1px */
}

额外小提醒 #

如果你的父容器里还有其他非div元素（比如p标签、span之类的），那:last-child可能会选中那个非div的最后子元素，这时候可以改用:last-of-type，比如.border:last-of-type——它会匹配父容器里最后一个div类型的元素，不管前面有啥其他类型的元素，只要这个div带.border类就生效。

总之，完全没必要新增类，用伪类就能干净利落地实现需求，既简洁又符合CSS的语义化写法~

内容的提问来源于stack exchange，提问作者R3y