最近見有的網站背景用的是視頻，看起來很高大上的樣子，自己也嘗試一把,直接上demo額這里的Hello World文字貌似放的不是地方，但是就這樣子吧，實現一下功能，之后考慮加到自己的網站中~

LL.gif

Document

*{

margin: 0px;

padding: 0px;

}

video{

position: fixed;

right: 0px;

bottom: 0px;

min-width: 100%;

min-height: 100%;

height: auto;

width: auto;

z-index:-11

}

source{

min-width: 100%;

min-height: 100%;

height: auto;

width: auto;

}

Hello World

示例中，需要掌握的知識點：

html5的video標簽的使用, 見下表：

z-index：設置元素的堆疊順序。擁有更高堆疊順序的元素總是會處于堆疊順序較低的元素的前面。

總結

以上是生活随笔為你收集整理的html视频做成背景图,《图解HTML》- video标签实现视频背景的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。