CSS可以用來鏈接網(wǎng)絡(luò)視頻,實現(xiàn)在網(wǎng)頁中嵌入視頻的效果。下面是一個簡單的例子:
video { width: 100%; height: auto; } <video controls> <source src="https://example.com/video.mp4" type="video/mp4"> <source src="https://example.com/video.webm" type="video/webm"> Your browser does not support the video tag. </video>
上面的代碼中,video元素用來顯示視頻,width和height屬性用來設(shè)置視頻的寬度和高度。controls屬性用于在視頻下方顯示“播放”、“暫停”等控制按鈕。
source元素用于指定視頻文件的URL和MIME類型。在上面的例子中,我們同時提供了MP4和WEBM兩個格式,在支持這兩種格式的瀏覽器中都可以正常播放。如果瀏覽器不支持任何一種格式,那么就會在video元素內(nèi)顯示“Your browser does not support the video tag.”的文本。
除了常規(guī)的視頻播放,CSS還可以實現(xiàn)一些高級的功能,例如:自動播放、循環(huán)播放、全屏播放等等。但是,這些功能都需要JS的支持,如果你感興趣,可以參考相關(guān)的CSS和JS文檔。