個人網站引入B站視頻播放,個人博客播放B站視頻。【1080P】

最近想在個人博客播放我在B站上面的視頻,花了三個下午,終於做好了。
有興趣的可以先看看最終效果: https://www.xdx97.com/video

1、代碼如下

<html>  
<head>  
<title>播放B站視頻</title>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<meta name="keywords" content="關鍵字" />  
<meta name="description" content="本頁描述或關鍵字描述" /> 
</head> 

<style>
    body{
        display: flex;
        justify-content: center;
    }
    .video{
        width: 1200px;
        height: 800px;
        border: 1px red solid;
    }
</style>
<body> 

    <div class="video">
        <iframe  src="https://player.bilibili.com/player.html?aid=95712170&bvid=BV11E411V7p8&cid=163401832&page=1&high_quality=1" 
            scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"  style="height: 100%;width: 100%;" > </iframe>
    </div>
        
</body> 
</html> 

2、自定義視頻播放

在這裏插入圖片描述

<iframe src="//player.bilibili.com/player.html?aid=94996320&bvid=BV1YE411T7Rc&cid=162171640&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

我們取出 src 裏面的內容,然後加上前綴 https: 加上後綴 &high_quality=1

最後得出我們的 url ,替換到前面的代碼裏面去就好了。這個後綴就是爲了達到 1080P

https://player.bilibili.com/player.html?aid=94996320&bvid=BV1YE411T7Rc&cid=162171640&page=1&high_quality=1
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章