Question

我正在开发Twitter网络应用程序。在段落中，如果我提到@username，我想使用css突出显示段落中的@username。什么是最容易做到的。我有jquery但无法弄清楚如何。感谢

Answer 1

你可以这样做，创建一个名为“highlight”的css类，用于突出显示并抓住段落内容。并替换为

$(function(){
    var str = paragraphtext;
    str = str.replace(/\B@([\w-]+)/gm, '<span class="highlight">@$1</span>');
    alert(str);
});

快速查看 demo

Answer 2

这对纯粹的CSS来说是不可能的..你可以 - 作为rahul状态 - 将样式应用于整个段落......但是直接用样式定位@something单词是不可能的，除非它已经用dom元素包裹。

你最好的选择是用javascript来解决这个问题，然后用<span class="user">@something</span>替换它们......你可以用css定位它们。

Answer 3

创建一个带有类的范围，这个类围绕您要突出显示的所有单词，并将所需的css分配给该类。

示例：

<p>This is text <span class="hl">@forsomeone</span> . 
You should also check <span class="hl">@abc</span> . 
What you say?</p>

和css

.hl {
  color: red;
}

Answer 4

检查此jquery插件