HTML5 WebVTT是指一種用于實現視頻字幕顯示的Web標準,其全稱為Web Video Text Tracks。通過使用HTML5 WebVTT視頻字幕格式,可以為Web視頻添加多種不同語言的字幕,從而為用戶提供更好的觀看體驗。
要設置HTML5 WebVTT,首先需要在視頻文件同一目錄下創建一個WebVTT字幕文件,文件名需要與視頻文件名相同,后綴為.vtt。如下所示:
video.mp4 video.vtt
在WebVTT字幕文件中,使用簡單的文本格式來定義字幕樣式、顯示時間和字幕內容。輸入以下代碼:
WEBVTT 00:00:00.000 -->00:00:05.000 Hello, world! 00:00:05.000 -->00:00:10.000 This is an example of WebVTT.
以上代碼表示了一段從視頻開始到5秒時的字幕 “Hello, world!”,以及一個時間段為5到10秒的字幕 “This is an example of WebVTT.”。其中,WEBVTT表示文件的類型。00:00:00.000和00:00:05.000是時間標志,表示字幕在視頻中顯示的時間段。
最后,在HTML5視頻中添加字幕,需要使用<video>元素并設置“track”屬性。例如:
<video controls width="560" height="315"><source src="video.mp4" type="video/mp4"><track src="video.vtt" kind="subtitles" srclang="en" label="English" default></video>
以上代碼表示視頻文件為video.mp4,WebVTT字幕文件為video.vtt。其中,kind="subtitles"表示設置字幕類型,srclang="en"表示字幕語言為英語,label="English"表示添加到字幕菜單中的標簽名為“English”,default表示默認開啟字幕。