::cue

版本：CSS3

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

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

语法:

E::cue{sRules}

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

• color
• opacity
• visibility
• text-decoration：text-decoration-line,text-decoration-color,andtext-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);
}

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com