网页入门1:视频/MP3外链嵌入文章CSS
本文最后更新于65 天前,如有版本迭代或环境切变,可告知邮箱到xianghy_m@sina.com指正修改。

1、视频原链接

本案所使用的Video
视频链接:https://www.bilibili.com/video/BV1MC41177oq/?share_source=copy_web&vd_source=411b78d992c07aa656f3ebd1e9fce52f

本案所使用的Audio
mp3链接:https://i.y.qq.com/v8/playsong.html?songid=230455456&songtype=0

2、Html格式

    | <iframe src="//视频id" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"></iframe> |
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=宽度参数 height=高度参数 src=" mp3链接"></iframe>

3.适应不同屏幕尺寸

<style>
  /* 默认样式,适用于大屏幕 */
  #video-iframe {width: 100%;height: 498px;}
  /* 媒体查询,适用于屏幕宽度小于768像素的设备,如手机 */
  @media (max-width: 768px) {#video-iframe {height: 100%;}

效果预览:

注:auto值改变初始播放状态

4.适用的第三方

在保证嵌入合法的前提下,国内在线视频媒体平台中支持托管和分享第三方主要有:

  1. 腾讯视频
  2. 优酷
  3. 爱奇艺
  4. 哔哩哔哩 (Bilibili)
  5. 西瓜视频
  6. 土豆视频
  7. 网易云音乐
  8. QQ音乐等

特例:抖音

抖音视频的URL通常是由抖音平台自动生成的,用户无法直接创建或修改。即使视频版权属于自己,通过其他工具生成内嵌代码再嵌入,也可能面临不合规问题。解决办法,稿件管理页面同步视频至西瓜视频。

文末附加内容
暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇