在CSS中控制省略号样式

我在与浏览器的“查找”功能类似的Web应用程序中实现搜索。我想在页面上突出显示搜索到的字符串。搜索字符串通常是使用省略号显示的较长字符串的子字符串。在CSS中控制省略号样式

我想突出显示搜索字符串，无论它出现在哪里，并且如果它在被省略号替换的文本部分中找到，那么我想突出显示省略号本身。

我该怎么做？

2013-02-25 Maor

我怀疑你的要求会非常棘手，如果不是不可能的纯CSS，因为首先，我不知道你得到很大程度上控制了CSS省略号的样式，其次，即使您可以按照自己的想法设计样式，但我不认为它能让您判断文本的哪些部分是可见的。另外，边缘情况如何，就像搜索字符串部分隐藏，或者它多次出现，只有一个隐藏？ – SDC 2013-02-25 09:08:09

你可以显示一些代码，告诉我们[你试过什么]（http://whathaveyoutried.com）？ – Jeroen 2013-02-25 09:08:11

如果存在JavaScript解决方案，我会很高兴。有没有办法知道文字的哪一部分是可见的？边缘情况很简单：如果搜索字符串的任何部分被隐藏，则省略号应该被突出显示。 – Maor 2013-02-25 13:05:42

使用以下组件来实现它：

的overflow:hidden容器元素
的overflow:auto内容元素
一个position:absolute亮点元素
class属性获取/设置状态

这里有几个演示，包括上述tioned要求：
Case Sensitive Search Bookmarklet
CSS Overflow Highlight

来源

2013-06-26 02:04:52

在CSS中控制省略号样式

回答

相关问题