css - 在 CSS 中使用::first-letter 时，个性化::selection 不起作用

Question

我现在正在学习 CSS 的基础知识，但在我的测试页面上发现了一些奇怪的东西。我正在写下 ::first-letter 的用途和 ::first-line只是出于习惯，我选择了全部。出于某种原因，在选择第一个单词 my ::selection 时没有个性化。更奇怪的是，这只是一封信。有那么一瞬间，我认为这可能是因为我将字体粗细设置为粗体，但其他粗体字母效果很好。

::selection{
    background-color: #8ebacc;
    color: black;
}

#first::first-letter{
    font-size: 30px;
    color: black;
    font-weight: bold;
}

#first::first-line{
    font-variant: small-caps;
    font-size: 20px;
}

<p id="first">Here I wrote a lot of text. This first line is very fancy, and even fancier is the first letter. This is to give some emphasis to everything there, to establish that that is indeed the first line of this paragraph. </p>

这是怎么回事？我该如何解决？

Answer 1

使用 ::first-letter与::selection在不使用 chrome 的情况下。它是 known bug这已经与 chrome dev 一起提出并且尚未修复。
如果您可以使用 firefox你可以考虑使用::mox-selection这在 Mozilla Firefox 中应该可以正常工作。

You can follow the developments and update: https://bugs.chromium.org/p/chromium/issues/detail?id=17528