html - 如何像 gmail 那样在 css 中剪辑文本到电子邮件主题列表

标签 html css

在 gmail 中,他们显示

主题 - 后面是正文的一小段

看起来正文被剪掉了,我假设这是用 css 完成的,gmail 样式表相当复杂,所以我不确定

无论如何,只有部分字母显示在被截断的行尾

有谁知道我怎样才能达到同样的效果,所以我在一列中得到完整的文本


明白了,谢谢@cletus

澄清一下,这就是我最终得到的结果

<div style="overflow: hidden; height: 20px;">mytitle<span style="color: gray; "> - my long description goes here</span></div>

最佳答案

要获得完整的文本剪裁效果,其中只有部分字母显示在元素的末尾,只需添加:

white-space: nowrap;

关于html - 如何像 gmail 那样在 css 中剪辑文本到电子邮件主题列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1232486/

相关文章:

html - angularjs中textarea和输入类型文本有什么区别

javascript - 无法让我的表格居中对齐

html - 使用页脚和侧边栏创建 100vh 页面时遇到问题

javascript - Angular 一个独立的 CSS block

css - 为什么子元素 Angular 的边界半径为 : inherit; doesn't align with parent's

jquery - 如何使用 CSS 和 jQuery 将文本区域扩展到其内容并禁用手动调整大小

javascript - 图形未显示

javascript - 如何在 javascript 和 php 中为字符串添加额外的单引号?

javascript - Cycle2 未运行

javascript - 请帮助 "data-ng-controller"不工作