存在一个最大宽度为200px的父容器div，容器内存在多个不定宽的span子节点,如何实现超过父容器宽度时显示省略号

你可以使用CSS的text-overflow属性来实现这个功能，例如：

div{
  max-width: 200px;
  overflow: hidden;
  white-space: nowrap;
}

span{
  display: inline-block;
  /* 如果span的宽度不定，则需要设置max-width来控制 */
  max-width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

解释一下上面的CSS代码：

- div的max-width属性限制了父容器的最大宽度为200px；
- overflow: hidden属性隐藏了溢出的内容；
- white-space: nowrap属性防止文本换行；
- span使用display: inline-block属性让它们变成块元素，可以控制它们的宽度；
- span使用max-width: 100%属性让它们的最大宽度不超过父容器；
- text-overflow: ellipsis属性在文本溢出时显示省略号。