CSS是否可以将段落中的字母定位为无跨距？

Question

我正在尝试给字母添加效果，但是我不想在各处添加一堆span标签。 是否可以使用CSS在一行文本中定位特定字母？

我知道有:first-child, :first-of-type, :only-child, :last-child, :last-of-type, :only-of-type ,:nth-child, :nth-of-type ,:nth-last-child我相信:first-child, :first-of-type, :only-child, :last-child, :last-of-type, :only-of-type ,:nth-child, :nth-of-type ,:nth-last-child和:nth-last-of-type 。 但是，这些帮助都无法以我的期望来完成。

这就是我要逐字针对的目标。 <p>Hello.</p>

这就是我所不想要的。 也没有Lettering.js 。

<p>
<span class"somefancyname">H</span>

<span class"somefancyname">e</span>

<span class"somefancyname">l</span>

<span class"somefancyname">l</span>

<span class"somefancyname">o</span>

<span class"somefancyname">.</span>
</p>

最后-使用那么多的span标签真的不好吗？ 如果使用那么多，我会觉得很脏...不确定为什么。 提前致谢！ 如果有人可以改写为有意义的话-我觉得我有点胡乱-谢谢！

注意：我想在字母上添加不同的动画。 不仅（1）放在页面上-这就是为什么我关注多个span标签。 什么动画？ 一些在这里弹跳，一些在那改变颜色，也许一些在上方旋转。 是我使用JS还是仅允许使用span标签的唯一解决方案？

Answer 1

我知道jQuery可以做到这一点：

$(document).ready(function(){
count = 0; limit = 10;
var refreshId = setInterval( function() {
if(count < limit) {

$( '.data tr:contains("blah")') .css( {"display":"none"} );
$( '.mainpart h2 a') .css( {"text-decoration":"underline" , "color":"#38c"} )

}
else {
clearInterval(refreshId);
}
}, 2000);
});