CSS操纵文字的长度 超出1行显示信息省略号的完成

日期:2020-12-12 类型:科技新闻 

关键词:微信小程序页面设计,python小程序,小程序首页模板,如何建立微信小程序,怎么做微信小程序

编码以下:

XML/HTML Code拷贝內容到剪贴板
  1. <div style="width:100px;height:20px;text-overflow:ellipsis; white-space:nowrap; overflow:hidden; ">a b c d e f g h i j k l , msa sd sd sa w df f </div>    

text-overflow特性仅是注释,当文字外溢时是不是显示信息省略标识。其实不具有其它的款式特性界定。大家要想完成外溢时造成省略号的实际效果。还务必界定:强制性文字在1行内显示信息(white-space:nowrap)及外溢內容为掩藏(overflow:hidden)。仅有这样才可以完成外溢文字显示信息省略号的实际效果。 

1、仅界定text-overflow:ellipsis; 不可以完成省略号实际效果。   

2、界定text-overflow:ellipsis; white-space:nowrap; 一样不可以完成省略号实际效果   

3、另外运用: text-overflow:ellipsis; white-space:nowrap; overflow:hidden; 可完成所要想获得的外溢文字

以上这篇CSS操纵文字的长度 超出1行显示信息省略号的完成方式便是网编共享给大伙儿的所有內容了,期待能给大伙儿1个参照,也期待大伙儿多多适用脚本制作之家。