::cue

版本： CSS3

CSS伪类 ::cue 元素匹配所选元素中的WebVTT提示。这可以用于在VTT轨道的媒体中使用字幕和其他线索。

网络视频文本轨道，简称为 WebVTT，是一种用于标记文本轨道的文件格式。它与 HTML5 <track> 元素相结合，可给音频／视频等媒体资源添加字幕，标题和其他描述信息，并同步显示。给媒体文件添加文本信息，是为了让媒体面向更多的人群，使其容易访问。如有听觉障碍的人，或者更普遍地说，不熟悉这门语言的观众。WebVTT 文件是一个以 UTF-8 为编码，以.vtt 为文件扩展名的简单文本文件。

语法:

E :: cue { sRules }

只有CSS一小部分属性可以与 ::cue 伪元素一起使用：

• color
• opacity
• visibility
• text-decoration ： text-decoration-line , text-decoration-color ,and text-decoration-style
• text-shadow
• background ： background-color , background-clip , background-image , background-origin , background-position , background-repeat , background-size , background-attachment , background-blend-mode
• outline ： outline-color , outline-style , outline-width
• font ： font-kerning , font-style , font-variant , font-variant-numeric , font-variant-position , font-variant-east-asian , font-variant-caps , font-variant-alternates , font-variant-ligatures , font-synthesis , font-feature-settings , font-language-override , font-weight , font-size , font-size-adjust , font-stretch , font-family
• line-height
• white-space
• text-combine-upright
• ruby-position

属性应用于整个提示集，就像它们是单个单元一样。唯一的例外是背景及其简写属性可以单独应用于每个提示，以避免创建框并遮盖意外大面积的媒体。

浏览器支持

IE、火狐浏览器不支持 ::cue 。其余浏览器支持。

例子

以下CSS设置提示样式，使文本为白色，背景为半透明黑盒。

::cue {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.6);
}