youtube html5播放失败的解决办法：1、打开youtube，找到视频，在视频右下角点击分享；2、选择嵌入；3、去除iframe标签里面的width和height；4、为iframe添加一个父元素，设置一个让视频填满屏幕的百分比即可。
本教程操作环境：Windows10系统、HTML5版、DELL G3电脑
HTML插入Youtube视频
网页需要插入youtube视频,直接用标签
立即学习“前端免费学习笔记（深入）”；
方法：
打开youtube，找到视频，在视频右下角点击分享。
选择嵌入，就会得到代码如下：
这是一串iframe标签内容，但是这样的代码直接放到页面文件里面，不能很好地调试和自适应。
因为宽度和高度都是固定的，无法调整。
解决：
去除iframe标签里面的width和height，这样直接得到的视频是压缩的，所以要为iframe添加一个父元素
iframe标签设为绝对定位，宽度高度都设100%，父元素相对定位，通过padding-bottom:%，设置一个让视频填满屏幕的百分比(可自行调试)
.youtube{padding-bottom: 57%;position: relative;}.elementor-video-iframe{max-width: 100%;width: 100%;border: none;position: absolute;height: 100%;}这样就能得到一个自适应的视频了，css样式也可以自己添加。
推荐学习：《HTML视频教程》
