Antworten zum Thema „Logo lässt sich nicht einblenden bei HTML5 Videohintergrund“

Xcheta · 22.09.2014

Hi Leute,

Ich habe ein kleines Problem ich wollte mich am Wochenende an eine Homepage setzten und wollte mal ein Video Background einbinden. Dieser Funktionier auch wunderbar. Nur habe ich das Problem das sobald ich ein Logo einblenden will das es nicht angezeigt wird selbst wenn ich nur einen Kasten mache mit 100 auf 100px und ihn rot mache. Kann mir jemand helfen ??

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Unbenanntes Dokument</title>
<style>
body, html { width:100%; width:100%; margin:0; padding:0;}
section { position:absolute; top:0; left:0; bottom:0; right:0; width:100%; height:100%; background:#000; overflow:hidden;}
section video { min-width:100%; min-height:100%; position:absolute; top:0; left:0; bottom:0; right:0;}
#ud_overlay { background:rgba(0,0,0,0.6);position:absolute; top:0; left:0; bottom:0; right:0; width:100%; height:100%; z-index:10;}

img {
z-index:5;

}

section {
z-index:1;
}

</style>

</head>

<body>

<img src="logo.jpg" alt="hallo">

<section>
<div id="ud_overlay"></div>
<video loop="loop" preload="auto" autoplay="" muted="muted">
<source src="video.mp4" type="video/mp4">
</video>

</section>

<div style="width:100px; height:100px; background-color:red;">
</div>

</body>

</html>

Dobi78 · 22.09.2014

Frage:
Warum verwendest Du nicht eine CSS Datei und bindest diese ein, statt im HTML direkt?? Verstehe ich nicht.
Ausserdem, hast Du "section" die Position "absolute" gegeben.....
Deine CSS Eigenschaften, geben für mich auch nicht wirklich einen Sinn.....welche Kentnisse hast Du überhaupt in HTML/CSS?