实际工作中,让某一行字不换行,多余字便显示省略号的这种需求还是挺多的。特地记录下来:
1 //这行文字内容的宽度 2 xxx; 3 //clip:不显示省略标记(...),而是简单的裁切;ellipsis:当对象内文本溢出时显示省略标记(...) 4 text-overflow: ellipsis; 5 //禁止文字换行 6 white-space: nowrap; 7 //溢出内容为隐藏 8 overflow: hidden;
这四个属性相互配合,便可解决遇到的问题。
实际工作中,让某一行字不换行,多余字便显示省略号的这种需求还是挺多的。特地记录下来:
1 //这行文字内容的宽度 2 xxx; 3 //clip:不显示省略标记(...),而是简单的裁切;ellipsis:当对象内文本溢出时显示省略标记(...) 4 text-overflow: ellipsis; 5 //禁止文字换行 6 white-space: nowrap; 7 //溢出内容为隐藏 8 overflow: hidden;
这四个属性相互配合,便可解决遇到的问题。