Sebastian Lukas Hauer
Lehrstuhl für Computergraphik, TU Dortmund
Sie können Hintergrundbilder auf mehrere Weisen in Folien einbetten.
Die erste ist das Angeben des Hintergrundbildes über das Attribut data-background-image
an einem Folientitel:
data-background-image
.
Die zweite ist das Angeben eines Hintergrundbildes als Markdown-Bild im Folientitel selbst:
Wenn Sie ein Hintergrundbild als Bild im Titel angeben, kann dieses mit folgenden Attributen angepasst werden:
size
: Größe des Bildes im Hintergrund. Gültige Werte sind: x%
, contain
, cover
.repeat
: Wenn das Bild nicht füllend ist, gibt dieser Wert an, ob es wiederholt werden soll oder nicht. Gültige Werte sind: repeat
und no-repeat
.opacity
: Deckungskraft des Bildes zur ursprünglichen Hintergrundfarbe in Prozent.position
: Position der oberen linken Ecke des Hintergrundbildes im Format x y
-Koordinate: z.B.: "128px 128px"
Diese Folie besitzt ein Hintergrundbild mit Deckungskraft 50%
. Es wird wiederholt. Es hat eine Größe von 50%
und der Ursprung des Ausgangsbildes ist an Position 128px 128px
:
Sie können auch Videos als Hintergründe angeben. Dies geht durch Angabe des Attributes data-background-video
im Folientitel oder als Videomedienelement im Titel einer Folie:
# Folientitel {data-background-video="pfad/zum/video.mp4"}
data-background-video
.
# Folientitel 
Wenn Sie das Video mithilfe der Angabe eines Medienelements im Titel der Folie einbetten können Sie anders als bei Videomedienelementen nur die Eigenschaft .muted
verwenden.
Die Eigenschaften .autoplay
und .controls
sind nicht Verfügbar, da mit einem Hintergrundvideo nicht interagiert werden kann.
Die Eigenschaft loop="1"
kann verwendet werden um das Video in einer Endlosschleife abzuspielen. Ohne diese Angabe endet das Video nach einem Durchlauf.
# Beispiel: Hintergrundvideo {.muted loop="1"}