給網(wǎng)站頭部添加視頻海報(bào)

heartFollower 發(fā)布于2019-04-23 13:16 / 1827人閱讀

摘要：給網(wǎng)站頭部添加視頻海報(bào)視頻海報(bào)設(shè)置透明度循環(huán)播放，自動(dòng)播放靜下來攜一縷清風(fēng)，續(xù)一杯清茶且聽風(fēng)輕云淡結(jié)果

 1 DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>視頻海報(bào)title>
 6     <style>
 7         *{
 8             margin: 0;
 9             padding: 0;
10         }
11     #banner{
12         width: 100%;
13         height: 500px;
14         background: purple;
15         overflow: hidden;
16         position: relative;
17     }
18     #banner video{
19         width: 100%;
20         position: relative;
21         opacity: 0.6;  /* 設(shè)置透明度 */
22     }
23 
24     #banner h2,h4{
25         position: absolute;
26         top: 120px;
27         left: 150px;
28         width: 100%;
29         text-align: left;
30         color: #fff;
31         line-height: 30px;
32         
33     }
34     #banner h2{
35         top: 80px;
36         font-size: 40px;
37         text-decoration: underline;
38     }
39     style>
40 head>
41 <body>
42     <div id="banner">
43         <video loop autoplay>    
44             <source src="video/banner.mp4">
45         video>
46         <h2>SLOW DOWNh2>
47         <h4>靜下來<br> 攜一縷清風(fēng)，續(xù)一杯清茶 <br> 且聽風(fēng)輕云淡h4>
48     div>        
49 body>
50 html>

結(jié)果

云服務(wù)器 GPU云服務(wù)器 js給視頻添加水印如何給網(wǎng)站添加js 給js添加數(shù)據(jù) 給XML文檔添加新

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/1651.html

相關(guān)文章

Web前端開發(fā)標(biāo)準(zhǔn)規(guī)范

摘要：頁(yè)面名稱月影功能模塊，請(qǐng)?jiān)谀K之間加入注釋，中英文不做要求活動(dòng)規(guī)則開始活動(dòng)規(guī)則活動(dòng)規(guī)則結(jié)束自定義函數(shù)。參考頁(yè)面前端規(guī)范 web前端開發(fā)規(guī)范的意義提高團(tuán)隊(duì)的協(xié)作能力提高代碼的復(fù)用利用率可以寫出質(zhì)量更高，效率更好的代碼為后期維護(hù)提供更好的支持一、命名規(guī)則命名使用英文語義化，禁止使用特殊字符，禁止使用拼音，禁止使用中英文混合！項(xiàng)目、目錄、html/css/js等文件命名全...

高璐 2019-08-30 15:55 評(píng)論0 收藏0
Web前端開發(fā)標(biāo)準(zhǔn)規(guī)范

摘要：頁(yè)面名稱月影功能模塊，請(qǐng)?jiān)谀K之間加入注釋，中英文不做要求活動(dòng)規(guī)則開始活動(dòng)規(guī)則活動(dòng)規(guī)則結(jié)束自定義函數(shù)。參考頁(yè)面前端規(guī)范 web前端開發(fā)規(guī)范的意義提高團(tuán)隊(duì)的協(xié)作能力提高代碼的復(fù)用利用率可以寫出質(zhì)量更高，效率更好的代碼為后期維護(hù)提供更好的支持一、命名規(guī)則命名使用英文語義化，禁止使用特殊字符，禁止使用拼音，禁止使用中英文混合！項(xiàng)目、目錄、html/css/js等文件命名全...

GHOST_349178 2019-08-23 15:17 評(píng)論0 收藏0
Web前端開發(fā)標(biāo)準(zhǔn)規(guī)范

摘要：頁(yè)面名稱月影功能模塊，請(qǐng)?jiān)谀K之間加入注釋，中英文不做要求活動(dòng)規(guī)則開始活動(dòng)規(guī)則活動(dòng)規(guī)則結(jié)束自定義函數(shù)。參考頁(yè)面前端規(guī)范 web前端開發(fā)規(guī)范的意義提高團(tuán)隊(duì)的協(xié)作能力提高代碼的復(fù)用利用率可以寫出質(zhì)量更高，效率更好的代碼為后期維護(hù)提供更好的支持一、命名規(guī)則命名使用英文語義化，禁止使用特殊字符，禁止使用拼音，禁止使用中英文混合！項(xiàng)目、目錄、html/css/js等文件命名全...

newtrek 2019-08-02 14:16 評(píng)論0 收藏0
精彩文章大合集- 收藏集 - 掘金

摘要：發(fā)布應(yīng)用市場(chǎng)的平臺(tái)搶紅包工具紅包精靈開源啦掘金紅包精靈，如果喜歡，點(diǎn)個(gè)開源不易。作者將原素材文章進(jìn)行了新內(nèi)容的添加和重新排列，但是因?yàn)槲恼赂咝У拇a編寫技巧總結(jié)前端掘金本文總結(jié)了代碼編寫技巧，來提升你的和代碼。收藏安卓開發(fā)中非常實(shí)用優(yōu)秀的庫(kù)! 有圖有真相! - Android - 掘金本來是打算收藏工具類的,但轉(zhuǎn)念一想,已經(jīng)有這么多優(yōu)秀的庫(kù)了,就沒必要再去重復(fù)造輪子了,便歸納工作中比...

ermaoL 2019-08-29 13:03 評(píng)論0 收藏0