视频播放器是在查看器中显示视频内容的矩形区域。
如果正在播放的视频的尺寸与视频播放器的尺寸不匹配,则视频内容将居中在视频播放器的矩形显示区域内。
以下CSS类选择器控制视频播放器的外观:
.s7videoviewer .s7videoplayer
视频播放器的CSS属性
背景颜色 |
主视图的背景颜色。 |
如果系统无法播放视频,则会显示错误消息,该消息可以进行本地化。 请参阅 用户界面元素的本地化 以了解更多信息。
示例 — 设置视频播放器大小设置为512 x 288像素的视频查看器。
.s7videoviewer .s7videoplayer{
background-color: transparent;
}
隐藏式字幕放置在视频播放器的内部容器中。 容器的位置由支持的WebVTT定位操作员控制。 题注文本本身位于该容器内,且其样式由以下CSS类选择器控制:
. s7videoviewer .s7 videoplayer .s7caption
隐藏式字幕的CSS属性
背景颜色 |
隐藏式字幕文本背景。 |
color |
隐藏式字幕文本颜色。 |
字体粗细 |
隐藏式字幕字体粗细。 |
字体大小 |
隐藏式字幕字体大小。 |
字体系列 |
隐藏式字幕字体。 |
示例 — 要将隐藏式字幕文本设置为半透明黑色背景上的14像素、浅灰色、Arial®:
.s7videoviewer .s7videoplayer .s7caption {
background-color: rgba(0,0,0,0.75);
color: #e6e6e6;
font-weight: normal;
font-size: 14px;
font-family: Arial,Helvetica,sans-serif;
}
使用以下CSS类选择器控制缓冲动画的外观:
.s7videoviewer .s7videoplayer .s7waiticon
等待图标的CSS属性
CSS属性 |
说明 |
---|---|
width |
动画图标宽度。 |
height |
动画图标高度。 |
边距 — 左 |
动画图标左边距,通常为图标宽度的一半。 |
边距 — 顶部 |
动画图标上边距,通常为图标高度的一半。 |
背景图像 |
旋钮图稿。 |
示例 — 要将缓冲动画设置为101像素宽,29像素高:
.s7videoviewer .s7videoplayer .s7waiticon {
width: 101px;
height: 29px;
margin-left: -50px;
margin-top: -15px;
background-image: url(images/sdk/busyicon.gif);
}