如何用CSS选择未被.icon前置的.text元素并添加左内边距？

给你两种可靠的实现方案，适配不同场景：

方案一：反向覆盖（兼容性最好） #

先给所有.text默认添加左内边距，再通过相邻兄弟选择器覆盖掉有前置.icon的情况：

.wrapper {
  display: flex;
  align-items: center;
}

/* 默认给.text设置左内边距 */
.wrapper .text {
  padding-left: 12px; /* 根据需求调整数值 */
}

/* 当.icon直接在.text前时，移除.text的左内边距 */
.wrapper .icon + .text {
  padding-left: 0;
}

这种方法逻辑简单，所有浏览器都支持，完全适配需求——只要.wrapper里没有.icon，或者.icon不在.text前面，.text都会保留左内边距。

方案二：使用:has伪类（现代浏览器专属） #

如果只需要支持现代浏览器，可以直接通过:has伪类精准选择不包含.icon的.wrapper下的.text：

.wrapper {
  display: flex;
  align-items: center;
}

/* 选中所有不含.icon子元素的.wrapper里的.text */
.wrapper:not(:has(.icon)) .text {
  padding-left: 12px;
}

注意：:has伪类在IE及部分旧版浏览器中不支持，适合不需要兼容旧环境的项目。

你之前尝试组合无效，大概率是写法逻辑有误——比如错误地试图用.text:not(.icon + .text)这种写法，:not无法直接识别相邻兄弟关系的前置元素，反向覆盖或者:has的写法才是正确思路。

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