Bildunterschriften
Das Standard-Erscheinungsbild der Beschriftungen kann sich ändern, sodass Sie die Beschriftungen möglicherweise formatieren möchten. Es gibt verschiedene Möglichkeiten, wie Untertitel gestaltet werden können:
Hinzufügen von Stiloptionen zur WebVTT-Datei
Stiloptionen können direkt auf die WebVTT-Datei angewendet werden, mit der Sie die Position und Ausrichtung der Beschriftungen sowie des Texts ändern können. Hier einige Beispiele:
- Fettgedruckter Text
<b>Lorem ipsum</b>
- Kursiver Text
<i>dolor sit amet</i>
- Unterstrichener Text
<u>consectetuer adipiscing</u>
Da der Brightcove Player die Positionierung von Beschriftungen verwaltet, können Sie keine Stile verwenden, um die Position oder Ausrichtung der Beschriftungen zu ändern. Die Inline-Stile bieten nicht viele Stiloptionen. Für eine größere Auswahl an Stiloptionen können Sie eine CSS-Datei verwenden, wie im nächsten Abschnitt beschrieben.
Einzelheiten zu Inline-Stilen finden Sie unter dieser Link.
Erstellen einer benutzerdefinierten Klasse in einer CSS-Datei
Eine benutzerdefinierte Klasse kann als Teil einer CSS-Datei erstellt und dann auf Elemente in der WebVTT-Datei angewendet werden. Beispielsweise ändert die folgende Klasse die Textfarbe in Weiß, die Hintergrundfarbe in Blau und macht die Schrift fett.
<style>
.captionstyle {
color:white;
background-color:blue;
font-weight:bold
}
</style>
Anschließend kann die WebVTT-Datei geändert werden, um die neue anzuwenden captionstyle
Wähler. Das c
Das Präfix bezeichnet den verwendeten Stil als Klassenselektor (dies ist ein Standard im WebVTT-Format).
WEBVTT 00:00:00.000 --> 00:00:03.530 ausrichten:Mittellinie:84 % 00:00:03.530 --> 00:00:06.510 ausrichten:mittlere Linie:90%<c.captionstyle>
In diesem Video lernen wir, wie man sich einloggt und navigiert</c>
00:00:06.510 --> 00:00:09.550 ausrichten:mittlere Linie:84 %<c.captionstyle>
innerhalb von Video Cloud Studio.</c>
Weitere Informationen zu den Gestaltungsoptionen für Untertiteldateien finden Sie in der W3C WebVTT-Spezifikationsdokument oder sehen dieser Link.
CSS Style Guide
Diese Tabelle zeigt, welche CSS-Eigenschaften für die Gestaltung von Untertiteln mit dem Brightcove Player unterstützt werden und welche nicht:
CSS-Eigenschaft | Unterstützt | Nicht unterstützt |
---|---|---|
font-family |
✔ | |
font-size |
✔ | |
font-weight |
✔ | |
color |
✔ | |
background |
✔ | |
background-color |
✔ | |
opacity |
✔ | |
visibility |
✔ | |
text-decoration |
✔ | |
text-shadow |
✔ | |
width |
✔ | |
height |
✔ | |
line-height |
✔ | |
white-space |
✔ | |
word-wrap |
✔ | |
top |
✔ | |
left |
✔ | |
display |
✔ | |
direction |
✔ |
Weitere Informationen zu den Gestaltungsoptionen für Untertiteldateien finden Sie in der W3C WebVTT-Spezifikationsdokument oder sehen Video-Untertitelung und WebVTT.
Benutzer-Styling von Untertiteln
Für Benutzer auf iOS-Geräten wird das Untertitel-Styling über die iOS-Einstellungen gesteuert. Um auf die Einstellungen zuzugreifen, wählen Sie die Einstellungen > Allgemeines > Barrierefreiheit > Untertitel & Untertitel > Stil. Hier können Sie einen vordefinierten Stil auswählen oder neue Stile erstellen.
Zuschauer auf Desktop- und Android-Geräten können das Erscheinungsbild der Untertitel mithilfe des Einstellungsmenüs für Untertitel ändern.

Wenn Sie auf das Menü mit den Untertiteleinstellungen klicken, wird eine Überlagerung angezeigt, in der die folgenden Beschriftungseigenschaften festgelegt werden können:
- Vordergrundfarbe und Deckkraft
- Hintergrundfarbe und Deckkraft
- Fensterfarbe und Deckkraft
- Schriftgröße
- Textkantenstil
- Schriftfamilie

Klicken Standardeinstellungen um die Beschriftungen auf ihren Standardstil zurückzusetzen.
Einschränkungen
Untertitel werden von den folgenden Gerätetypen und Betriebssystemen unterstützt.
- iOS 10+
- Android 7+
- Internet Explorer 11+
- Die neuesten Edge-, Chrome-, Safari- und Firefox-Browser auf Desktops