CSS可以应用于< track>吗？元件 [英] Can CSS be applied to <track> element

问题描述

因此，在编写自己的自定义HTML5视频播放器时遇到了问题。是否可以将任何CSS规则应用于< track> 元素？有讨厌的骇客吗？我想控制< track> 和 font-size 的位置。

So I ran into problem while writing my own customized HTML5 video player. Can any CSS rules be applied to <track> element? Any nasty hacks? I want to control position of <track> and font-size.

<div id="movie-01">
<video id="video" controls preload="metadata">
   <source src="files/movie-01/movie.mp4" type="video/mp4">
   <track label="Chinese Traditional" kind="subtitles" srclang="cht" src="files/movie-01/cht.vtt" default>
</video>
</div>
<style>
    track{
      color: #FAFAFA;
      font-size: 1em;
    }
</style>

推荐答案

根据 WebVTT， < track> 元素无法使用CSS渲染，因此无法向其中添加CSS。您可以更改特征和给定的 cue ，但除​​此之外没有其他内容。 此处是一个很好的教程，可以创造性地使用它们。最接近样式的方法是将其与div环绕，然后将样式应用于div本身。对不起，没有讨厌的骗局。 ：/

According to the WebVTT, The <track> element cannot be rendered with css, thus there is no way to add css to it. You can change traits and the given cue, but nothing beyond that. Here's a nice tutorial for creative use of these. The closest you can get to styling it is surrouding it with a div and applying the style to the div itself. Sorry, no nasty hax. :/

编辑：禁止使用一种令人讨厌的恶作剧，但这对凡人是非常危险的。当心，如果您接近这些技术，可能会遇到最严重的错误和恶魔。

EDIT: There is one forbidden nasty trick, but it's highly dangerous for the mortal. Beware, for the worst bugs and demons you've ever seen if you ever get close to these technics.

给定的track元素可以嵌入受其保护的Audio元素内，因为它们都共享不一样的HTML5媒体播放器种族。 Mozilla文档具有漂亮的滚动您的追求；它包括以下内容：

A given track element can be embeded inside an Audio element, protected by it, since they both share the unliked race of HTML5 media players. The mozilla docs have a nice scroll which may help you in your quest; it includes the following:

<audio src="foo.ogg">
  <track kind="captions" src="foo.en.vtt" srclang="en" label="English">
  <track kind="captions" src="foo.sv.vtt" srclang="sv" label="Svenska">
</audio>

不听任何规则

禁止的预言一次提到，没有使用CSS的已实现音频播放器-但是，选择了一个人可以自己做。他或她应关闭 controls 属性，并使用javascript从头开始实现控件。他们可能会以现有的音频播放器的部分实现形式，例如您的儿时朋友。 a>

Listen to no rules

As a forbidden prophecy once mentioned, there's no implemented audio player which uses CSS - however, the chosen one could make their own. He or she shall leave the controls attribute off, and implement the controls from the scratch using javascript. They might get a few followers to assist them in the form of existing audio players partial implementation, such as your childhood friend.

一旦选定的人掌握了各种样式控件， js，他们可能会使用秘密的inner-trait-css-styling-non-justu并将样式添加到音频控件的内部元素中，其中之一就是音轨。

Once the chosen one has mastered the various arts of styling controls with js, they may use the secret inner-trait-css-styling-non-justu and add styling to the inner elements from the audio controls - one of which, is the track.

祝你好运，冒险家。如果您愿意，您将是第一个活着回来的人。如果愿意的话，请告诉我们您的激烈战斗的故事。

Good luck, adventurer. You'll be the first to ever come back alive, if you will. And if you will, please tell us the tale of your mighty battles.

这篇关于CSS可以应用于< track>吗？元件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！