是否存在可匹配元素多行显示状态的CSS选择器？

目前不存在可以直接匹配「元素是否发生折行」的原生CSS选择器。CSS的选择器匹配逻辑仅面向DOM结构、元素属性、预定义交互状态等，不会读取元素渲染后的实际布局结果，所以无法直接通过CSS判断导航是否折为了多行。

你可以根据你的场景选择以下两种常用的替代实现方案：

• 固定内容场景用媒体查询
  如果你的导航菜单内容是固定不变的，可以先测试得到导航刚好发生折行的临界屏幕宽度，比如实测下来宽度小于768px时菜单会折行，直接写对应媒体查询规则即可：

a {
  background: red;
}
/* 宽度小于临界值时修改背景色 */
@media (max-width: 768px) {
  a {
    background: green;
  }
}

这种方案实现成本最低、性能最优，是绝大多数静态站点的首选方案。

• 动态内容场景用JS辅助判断
  如果你的导航内容是动态生成的，无法提前确定折行的临界宽度，可以搭配少量JS检测导航容器的高度判断是否折行，再通过类名控制样式：
  首先写CSS规则：

a {
  background: red;
}
/* 折行状态下的样式 */
.nav-wrap.is-multi-line a {
  background: green;
}

再加入JS检测逻辑：

const navWrap = document.querySelector('.nav-wrap')
// 替换为你站点单行导航的实际高度
const SINGLE_LINE_HEIGHT = 40

function checkNavMultiLine() {
  navWrap.classList.toggle('is-multi-line', navWrap.offsetHeight > SINGLE_LINE_HEIGHT)
}

// 页面加载、窗口缩放时都执行检测
window.addEventListener('load', checkNavMultiLine)
window.addEventListener('resize', checkNavMultiLine)

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