如何为多个#id元素设置::before伪元素？CSS多ID共用伪类写法咨询

你之前的写法不生效是因为CSS逗号分隔的选择器会独立解析，#ps4, #ps3 ::before实际匹配的是两类元素：所有id="ps4"的元素本身、所有id="ps3"元素的::before伪元素，自然达不到预期效果。

正确实现方式 #

你需要给每个ID选择器都单独加上::before伪元素标识，写法如下：

#ps4::before, #ps3::before {
  /* 此处写入共用的样式逻辑 */
}

注意：你原有代码里#ps4 ::before（ID和伪元素之间有空格）匹配的是#ps4的所有子元素的::before伪元素，如果你需要给#ps4元素本身加伪元素，要去掉中间的空格。

如果后续还有更多同需求的元素，更推荐的简化方案是给这类元素加一个统一的公共类名，比如device-card，之后直接写.device-card::before就可以批量覆盖所有同类元素，不用每次新增ID都修改选择器列表，维护更便捷。

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