如何使用CSS仅修改单个段落的颜色？

不用修改HTML的话，可以依靠CSS的结构伪类选择器来定位特定段落，以下是几种可行方案：

• 按父元素下的子元素位置定位（nth-child）
  适用于所有段落都是同一个父元素直接子元素的场景，通过指定序号选中目标段落：

  /* 先给所有段落设置默认颜色 */
  p {
    color: #666;
  }
  /* 选中第2个段落设为绿色 */
  p:nth-child(2) {
    color: green;
  }
  /* 选中第3个段落设为蓝色 */
  p:nth-child(3) {
    color: blue;
  }
  

• 按同类型元素位置定位（nth-of-type）
  如果父元素里还有其他标签（比如h1、div），这个选择器只会统计<p>标签的顺序，定位更精准：

  p {
    color: #666;
  }
  /* 页面中第2个<p>元素设为绿色 */
  p:nth-of-type(2) {
    color: green;
  }
  /* 页面中第3个<p>元素设为蓝色 */
  p:nth-of-type(3) {
    color: blue;
  }
  

• 首尾段落快速定位
  如果要修改的是第一个和最后一个段落，用:first-child和:last-child更直接：

  p {
    color: #666;
  }
  p:first-child {
    color: green;
  }
  p:last-child {
    color: blue;
  }
  

注意：如果段落分布在不同父元素下，需要给对应父元素加选择器前缀（比如.article p:nth-child(2)），确保精准选中目标段落。

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