背景：我正在尝试修复Chrome中音频元素外观上的两个烦恼，在尝试这样做时，我遇到了两个问题，我想更好地理解。这是关于MacOS上的Chrome 89。我很好地管理了音频元素内部的样式，使用伪选择器。当使用dom检查器查看影子dom内部时，找出伪选择器的名称会很好地工作。例如，以下两个规则完全按照预期工作：

::-webkit-media-controls-timeline{background-color：pink；}audio::-webkit-media-controls-time-raying-display{background-color：lightgrey；}

问题：然而，有两件事并不像预期的那样起作用，我想知道为什么。

问题1：样式化剩余显示div中的第一个字母不起作用。以下规则无效。

audio::-webkit-media-controls-time-relaying-display：first-letter{color：white；}

这是令人吃惊的，因为浏览器会显示

...

正如所料。为什么我不能给第一个字母打字？（这样做的想法是为了去掉剩余时间显示中最烦人的前导/符号）。

问题2：

为什么我不能在阴影DOM的不同部分为具有不同伪属性的元素设置样式。更确切地说，以下规则是无效的：

::-internal-track-segment-highlight-before{background-color：blue；}

我看不出与上面的另一个情况有什么不同，在这里颜色样式起作用。（这样做的想法是为了增加轨道段两部分之间太小的对比度。）

补充一下：我设法改进了一点对比度，使用

音频：：-webkit-media-controls-timeline{-webkit-filter：brightence（2.5）；}

但问题仍然是为什么一种方法有效而另一种方法不起作用。