Html CSS中段落中的重复颜色模式

我有一个段落标签，我希望其中的文本每隔一个字母为橙色，其余字母为深橙色。惰性代码如下所示：

Html

（第二种颜色变为蓝色以便于观察）

---

如何使代码看起来不那么懒惰？我知道当你第一次读到这个问题时，你可能会想“不可能。只能用巫术才能做到”，但我认为这应该很简单。我会处理任何事情，甚至是让图像在文本中重复的方法。

在CSS中，你不能针对字符数据内容的单个字母，只能针对元素和伪元素的一小部分。因此，您确实需要标记。但是，您应该永远不要在类中使用表示名称，这是CSS的工作。因此，请使用匿名语义内联元素

，无需更多详细信息，然后只需使用高级CSS选择器：

<p>
    <span>L</span>
    <span>o</span>
    <span>r</span>
    <span>e</span>
    <span>m</span>
</p>

---

.

使用此

.yellow{color:blue；}

进行测试。差异将更加明显。：）@库里奥苏：好吧，我只是不想让人们认为我在用户体验方面很糟糕。@showdev让我澄清一下。我想要CSS！！！很抱歉没有在我原来的帖子中提到这一点：（你可能想删除“javascript”标记和“我会处理一切”部分。投票重新打开。@showdev什么？javascript标记？嘎，习惯的力量：（有了这个，我就不能把每封信都拆开而不留一个空格，把第n个孩子去掉吗？）是的，为了完整起见，我把所有的都放在那里了，但那也确实有用。我知道我不应该担心这个微优化，但我可以把所有的东西都放在空格里，去掉段落和广告中的颜色设置第n个孩子（偶数）使css加载更快？不，这实际上是无关紧要的，因为浏览器处理css的方式不同。

.yellow {
    color: darkorange;
}

.orange {
    color: orange;
}

<p>
    <span>L</span>
    <span>o</span>
    <span>r</span>
    <span>e</span>
    <span>m</span>
</p>

p {
  color:orange;
}
p span:nth-child(odd) {
  color:yellow;
}