段落文本到单行并仅显示最后一个字符

Question

在我的程序中，我添加了限制段落文本在 CSS 中单行显示的功能。

white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
display: inherit;

但它只显示初始单词。我想在溢出时显示段落的最后一个字。

原文：

Pattern Based Writing: Quick & Easy Essay 的目的是教学生如何快速、轻松地组织信息和明确要点。

当前输出：

Pattern Based Writing: Quick & Easy Essay 的目的是快速轻松地教授学生..

预期输出：

Essay 是为了教学生如何快速、轻松地组织信息和明确要点。

如何使用 CSS 实现此目的？

Answer 1

Text-overflow ellipsis on left side

的副本

HTML:

<p><bdi>The purpose of Pattern Based Writing: Quick & Easy Essay is to quickly and easily teach students how to organize information and make points clear.</bdi></p>

CSS:

p {  
  white-space: nowrap;                   
  overflow: hidden;
  text-overflow: ellipsis;  
  width:550px;
  direction:rtl;
  text-align:left;
}

段落文本到单行并仅显示最后一个字符

Paragraph text to single line and display only last characters

html

css

user-interface

user-experience