p标签不换行,超出部分用...替代

这个东西以前就做过,用的js判断字数超出改成点点点.本来一个三元运算符就能解决的

text.length>50?text.substring(0,50):text;

但是!!这次需求不一样,要求在缩放情况下仍然能够保持,这下就只能用css了
通过查阅w3c找到了几个属性,就能实现了,还没测试,不确定会有什么兼容性问题

 .title{
    width: 95%;
    // 文本强制不换行
    white-space: nowrap;
    // 溢出显示省略号
    text-overflow: ellipsis;
    // 溢出的部分隐藏
    overflow: hidden;
  }

你可能感兴趣的:(CSS)