使用JQuery或CSS根据div宽度自动限制文本[重复]

Posted 2023-03-06

【中文标题】使用JQuery或CSS根据div宽度自动限制文本[重复]

【英文标题】：Limit text automatically according to div width using JQuery or CSS [duplicate]

【发布时间】：2021-01-26 19:23:53

【问题描述】：

使用 JQuery 或 CSS 根据 <div> 宽度自动限制文本

输入：这是我的文本，我想限制。

.limit-text
  width:300px;


<div class="limit-text">
   <span>This is my text and I want to limit.</span>
</div>

输出：这是我的文字，我是……

【问题讨论】：

欢迎来到 Stack Overflow！预计您至少会尝试自己编写代码。我建议你做一些additional research，通过谷歌或搜索SO，尝试一下。如果您仍然遇到问题，请返回您的代码并解释您尝试过的操作。

您好！ :) 你可以参考这个。 ***.com/questions/11426275/…

【参考方案1】：

你可以用纯 CSS 做到这一点。

.limit-text
  width:300px;
  white-space: nowrap; 
  overflow: hidden; 
  text-overflow: ellipsis;


<div class="limit-text">
This is my text and I want to limit
</div>

如需更多详细说明，请阅读 Tweet@denicmarko 在 Twitter 上