【效果实现】在照片上面显示一段文字，最多两行，多余部分用省略号表示

PascalXie 发布于2019-08-02 15:32 / 2407人阅读

摘要：思路照片上面显示文字，怎么实现呢将照片作为的背景呀效果图多行文本溢出显示我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字单行文本溢出

思路：照片上面显示文字，怎么实现呢？
将照片作为div的背景呀！

效果图：

html:

我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字

我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字

css

单行文本溢出显示省略号

/* 单行文本溢出隐藏 */
    .oneline {
      width: 400px;
      /* 不换行 */
      white-space: nowrap;
      /* 溢出隐藏 */
      overflow: hidden;
      /* 溢出的文本用省略号显示 */
      text-overflow: ellipsis;
    }

多行文本溢出显示省略号

/* 多行文本溢出隐藏 */
    .text {
      width: 200px;
      /* 将元素作为box伸缩盒子 */
      display: -webkit-box;
      /* 设置文本排列方式 */
      -webkit-box-orient: vertical;
      /* 设置文本行数限制 */
      -webkit-line-clamp: 2;
      /* 溢出部分隐藏 */
      overflow: hidden;
      /* 文本溢出的部分显示省略号 */
      text-overflow: ellipsis;
    }

input 溢出显示省略号

/* input的溢出显示省略号 */
    input {
      /* 对于input只需要这一行,因为input本身就不会换行,本身就会溢出隐藏 */
      text-overflow: ellipsis;
    }

混合云私有云 js 最多显示两行 html显示在最上面 html 省略两行 multicharts如何在云主机上面用

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/54189.html

【效果实现】在照片上面显示一段文字，最多两行，多余部分用省略号表示

摘要：思路照片上面显示文字，怎么实现呢将照片作为的背景呀效果图多行文本溢出显示我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字单行文本溢出思路：照片上面显示文字，怎么实现呢？将照片作为div的背景呀！效果图： showImg(https://segmentfault.com/img/bVbuV...

魏宪会 2019-08-05 17:33 评论0 收藏0
【效果实现】在照片上面显示一段文字，最多两行，多余部分用省略号表示

摘要：思路照片上面显示文字，怎么实现呢将照片作为的背景呀效果图多行文本溢出显示我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字我是一段很长的文字单行文本溢出思路：照片上面显示文字，怎么实现呢？将照片作为div的背景呀！效果图： showImg(https://segmentfault.com/img/bVbuV...

alaege 2019-08-30 11:22 评论0 收藏0
如何让文本只显示两行——块级文字省略

摘要：在页面显示中我们经常会需要进行省略，比如简介里面的省略，比如固定中字数超过限制之后的省略。单行文字的省略单行文字省略比较简单。在页面显示中我们经常会需要进行省略，比如简介里面的省略，比如固定div中字数超过限制之后的省略。我们可以用css轻松做到。单行文字的省略单行文字省略比较简单。关键代码如下： .single { width: 280px; ...

BetaRabbit 2019-08-30 15:55 评论0 收藏0
如何让文本只显示两行——块级文字省略

摘要：在页面显示中我们经常会需要进行省略，比如简介里面的省略，比如固定中字数超过限制之后的省略。单行文字的省略单行文字省略比较简单。在页面显示中我们经常会需要进行省略，比如简介里面的省略，比如固定div中字数超过限制之后的省略。我们可以用css轻松做到。单行文字的省略单行文字省略比较简单。关键代码如下： .single { width: 280px; ...

zollero 2019-08-23 15:18 评论0 收藏0
Android TextView常用属性

摘要：某些特殊的情况下会用作为单位表示字体大小属性三表示中的文字相对于的对齐方式。对于部分显示属性值或者。青春，是一场花开的遇见青春，是一场痛并快乐着的旅行青春，是一场轰轰烈烈的比赛青春，是一场鲜衣奴马的争荣岁月青春，是一场风花雪月的光阴。　　【说明】 TextView是用来显示文本的组件。以下介绍的是XML代码中的属性，在java代码中同样可通过组件名.setXXX()方法设置。如...

ckllj 2019-04-23 17:42 评论0 收藏0