CSS 文字溢出隐藏 [显示省略号]

发表评论
单行文字隐藏

可以采用 溢出隐藏 + 文字溢出隐藏 方式实现

  /* (属性是用来设置如何处理元素中的 空白 (en-US)。)让文本一行显示 */
  white-space: nowrap;
  /* 溢出内容隐藏 */
  overflow: hidden;
  /* 溢出文字用省略号替代 */
  text-overflow: ellipsis;

//单行省略号显示

文言文是 中国古代 的一种汉语书面语言组成的文章

多行文字隐藏

   /* 溢出内容隐藏 */
   overflow: hidden;
   /* 溢出文字用省略号替代 */
   text-overflow: ellipsis;
   /* 弹性伸缩盒子模型显示 */
   display: -webkit-box;
   /* 限制在一个块元素显示的文本行数 */
   -webkit-line-clamp: 5;
   /* 设置或检索伸缩盒子对象的子元素排列方法 */
   -webkit-box-orient: vertical;

//多行溢出省略号显示

文言文是 中国古代 的一种汉语书面语言组成的文章，“五四运动”以前汉民族所使用的语言。主要包括以先秦时期的口语为基础而形成的书面语言。春秋战国时期，用于记载文字的物品还未被发明，记载文字用的是竹简、丝绸等物。随着历史变迁，口语的演变，文言文和口语的差别逐渐扩大，“文言文”成了读书人的专用

发表回复