html5视频作为页面背景
生活随笔
收集整理的這篇文章主要介紹了
html5视频作为页面背景
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
之前的代碼因為chrome的升級,視頻文件無法自動播放了。在這里更新一下源碼,親測可用。
復制代碼并且替換視頻文件即可。當然,比較懶得同學,掃碼文末的二維碼,關注公眾號,在后臺回復:小視頻。即可獲取源代碼和附帶的mp4視頻文件哦。
<!DOCTYPE HTML> <html> <style>*{ margin: 0px; padding: 0px; } video{ position: fixed; right: 0px; bottom: 0px; min-width: 100%; min-height: 100%; height: auto; width: auto; /*加濾鏡*//*filter: blur(15px); //背景模糊設置 *//*-webkit-filter: grayscale(100%);*/ /*filter:grayscale(100%); //背景灰度設置*/ z-index:-11} source{ min-width: 100%; min-height: 100%; height: auto; width: auto; } p{width: 100%;text-align: center;font-size: 40px;color: white;} </style> <body> <p>大家好 </p> <p>大家好 </p> <p>大家好 </p> <p>大家好 </p> <p>大家好 </p> <p>大家好 </p> <video autoplay loop muted><source src="./movie.mp4" type="video/mp4" /> Your browser does not support the video tag. </video></body> </html>關注公眾號獲取更多內容,有問題也可在公眾號提問哦:
?
強哥叨逼叨
叨逼叨編程、互聯網的見解和新鮮事
?
總結
以上是生活随笔為你收集整理的html5视频作为页面背景的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 编程基础之二十一:导师巴贝奇与Ada(四
- 下一篇: 如何写学术论文的rebuttal?