Html5中的video元素

最近在作門戶的時候遇到要顯示企業的視頻介紹，須要找到一個在aspx頁面播放視頻的html，最後找到了是一段HTML5最新的html代碼，以下：

/// <summary>
        /// 播放視頻的html5
        /// </summary>
        /// <param name="videoPath"></param>
        /// <returns></returns>
        private string PlayVideo(SPFolder videoFolder, string isAutoPlay)
        {
            string result = string.Empty;

            result = string.Format(@"
                                        <div class='ms-webpart-chrome ms-webpart-chrome-vertical ' style='width: 350px;height:198px'>
                                            <div class='ms-WPBody noindex ' id='WebPartctl00_ctl33_g_0eb8afcc_09fa_47a4_8493_d7517ccfddbd' style='width: 350px; height: 198px;' allowdelete='false' haspers='false' webpartid='0e199fb4-378d-483f-910b-f15ed4b22623' allowexport='false' allowremove='false' webpartid2='0eb8afcc-09fa-47a4-8493-d7517ccfddbd'>
                                                <div class='mediaPlayerContainer' style='width: 100%; height: 100%;'>
                                                <video width='350' height='198' id='ctl00_ctl33_g_0eb8afcc_09fa_47a4_8493_d7517ccfddbd' preload='none' controls='' 
                                                        poster='{1}' data-mediatitle='{3}' {4} data-init='1'>
                                                        <source src='{0}' type='video/mp4' data-label='{3}'>
                                                    <object width='100%' height='100%' id='ctl00_ctl33_g_0eb8afcc_09fa_47a4_8493_d7517ccfddbd' data='data:application/x-silverlight-2,' type='application/x-silverlight-2'>
                                                        <param name='source' value='/_layouts/15/clientbin/mediaplayer.xap?rev=zuBbpwS4QIoVfmLpIUt3Og%3D%3D'>
                                                        <param name='enableHtmlAccess' value='true'>
                                                        <param name='windowless' value='true'>
                                                        <param name='background' value='#80808080'>
                                                        <param name='initParams' value='mediaTitle={3},mediaSource={0},previewImageSource={1},showEmbedControl=false,autoPlay=true,videoSetSource={2},startPlayBackAt=0'>

                                                        <a style='text-decoration: none;' href='http://go.microsoft.com/fwlink/?LinkID=124807'><img style='' alt='Get Microsoft Silverlight' src='http://go.microsoft.com/fwlink/?LinkId=108181'></a><a title='Download Media' class='media-link' href='{0}'><span class='media-title'>Download Media</span></a>
                                                    </object>
                                        </video>
                                        <div class='mediaPlayerFullScreenEsc'><span>Press ESC to exit full-screen mode.</span></div>
                                        <div class='mediaPlayerTitleOverlay'><span>{3}</span></div>
                                        <div class='mediaPlayerInitialPlayButton' style='display: none;'><a title='Play' href='javascript:;'><span></span></a></div></div><input name='ctl00$ctl33$g_0eb8afcc_09fa_47a4_8493_d7517ccfddbd$HiddenInput' id='ctl00_ctl33_g_0eb8afcc_09fa_47a4_8493_d7517ccfddbd_HiddenInput' type='hidden'>
                                        <div class='ms-clear'></div></div>
                                        </div>", videoFolder.Files[0].ServerRelativeUrl, "/sites/Ben/Style Library/Media Player/VideoPreview.png", videoFolder.ServerRelativeUrl, videoFolder.Files[0].Name, isAutoPlay);
            return result;
        }

通常咱們只要讀取到Asset Library中的item項便可調用PlayVideo(item.Folder,」」),便可播放視頻，固然注意代碼中站點的路徑問題！並且前臺咱們還須要引用一段CSS，以下：

<link href="/_layouts/15/1033/styles/controls15.css?rev=kvFPx0lLkCPD61%2FeZTZBnA%3D%3D" rel="stylesheet" type="text/css">

這樣視頻就能夠播放了，通常支持比較常見的格式。

你們都知道Html5，是正在推薦使用的html,目前可能有些瀏覽器還不能支持其包含的元素，之後做爲統一的標準，會支持的愈來愈好！

但願對你們全部幫助！