介绍
HTML <embed> 标签可用于将各种类型的内容（如图片、视频和其他网页）嵌入到我们的网页中。在本实验中，我们将使用 HTML <embed> 标签将 YouTube 视频添加到网页中。
注意：你可以在
index.html中练习编码，并学习如何在 Visual Studio Code 中编写 HTML。请点击右下角的“Go Live”以在端口 8080 上运行 Web 服务。然后，你可以刷新 Web 8080 标签以预览网页。
HTML 文档结构
创建一个名为 index.html 的新文件。
创建 index.html 文件后，添加包含 head 和 body 元素的基本 HTML 文档结构。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>HTML Embed Tag Lab</title>
</head>
<body></body>
</html>
使用 HTML 标签添加视频
要在网页中添加视频，你需要使用 YouTube 的嵌入代码。
访问 YouTube 上的任意视频。
在视频下方，点击“分享”按钮，然后点击“嵌入”按钮。这将打开嵌入视频窗口。
复制嵌入视频窗口中显示的 HTML 代码。
将代码粘贴到
index.html文件的<body>元素中。<embed src="https://www.youtube.com/embed/TWfph3iNC-k" />
设置视频的宽度和高度
为了避免尺寸问题，设置视频的宽度和高度非常重要。
在
<embed>标签中添加height和width属性。width属性定义视频的宽度，height属性设置其高度。<embed src="https://www.youtube.com/embed/TWfph3iNC-k" width="560" height="315" />
保存 index.html 文件并在浏览器中打开，以验证视频是否已成功添加。
为不支持的浏览器添加回退方案
并非所有浏览器都支持 <embed> 标签。为了确保你的网页在不支持的浏览器中仍然可用，可以添加一个回退选项。
添加
<object>标签，并通过参数指定嵌入内容的类型和资源的 URL。<object type="text/html" data="https://www.youtube.com/embed/TWfph3iNC-k" width="560" height="315" > <p>你的浏览器不支持 HTML5 视频元素。请升级到现代浏览器。</p> </object>
保存 index.html 文件并在不支持 <embed> 标签的浏览器（如 Internet Explorer）中打开，验证回退选项是否生效。
总结
恭喜！你已经成功学会了如何使用 HTML <embed> 标签在网页中添加视频。别忘了检查浏览器支持情况，并在必要时使用回退选项。
