I need to set up a website with a video as the background.
Will I be able to use z-index
to position other elements on top of the video? Is there a better alternative?
I have not tested it, but you could try to set width/height of <video>
to 100%
then using z-index let all the others element stay on top of it...
Edit: for example to set video as background entire page
<body style="height: 100%;width: 100%">
<div style="position: fixed; top: 0; width: 100%; height: 100%; z-index: -1;">
<video src="" width="100%" height="100%" autoplay>
Your browser does not support the video tag.
</video>
</div>
... rest of your site
You can not apply it as a CSS background (background property). You can give the effect though using layers which is controlled via the z-index property.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With