隐藏部分文本html、css、javascript

如何在

div

或

span

中隐藏部分文本

我有一个160个字符的文本，但我想只显示前40个字符

---

我必须在我的

div

，

span

中包含完整的文本，就像我进行javascript搜索一样。

您需要一些javascript在最后120个字符周围创建一个span来隐藏它们。有一个CSS属性“可见性：隐藏”，可以应用于跨度

结果应该是这样的：

<div>first 40 chars <span style="visibility:hidden">last 120 chars</span></div>

前40个字符后120个字符

如果要将div剪辑为特定大小，而不是精确的字符数，则只需为div指定所需的大小，然后指定

溢出：隐藏

以剪辑不适合的内容

---

如果确保div的高度与文本的行高相等，则不会将内容剪裁在行的（垂直）中间。

可以为元素“文本溢出：省略号；”使用简单的css属性 要有效地使用此属性，您需要同时应用一些相关属性

例如：

<div style="width: 50px; text-overflow: ellipsis; white-space: nowrap;
overflow: hidden;">Some text goes here</div>

这里有一些文字

---

*在Chrome中测试。

显示/隐藏CSS中标准文本部分的一个有趣属性是文本溢出。不需要JS。 文本的宽度（在下面的代码段示例中为200px）对应于默认情况下要显示的文本的“剪辑”

div{
宽度：100%；
}
自动显示区{
空白：nowrap；
宽度：200px；
溢出：隐藏；
文本溢出：省略号；
}
div.autoShowHide：悬停{
空白：正常；
溢出：可见；
宽度：100%；
}

查看全文：

---

这就引出了一个问题：“我如何找到前40个字符？”。。。（假设这不是静态HTML）@Madmartigan如果它不是静态HTML，则可以在服务器上生成页面时添加跨度。在PHP或ASP中不应该太难。使用JQuery也很简单。