Question

今天我开始编写一个网页来演示我们的术语末期图形项目，我认为这很简单，最终导致我花费了几个小时的时间。具体来说，我有一个youtube嵌入不起作用。以下是该页面的代码：

<?xml version = "1.0" encoding = "utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>3D OpenGL Chess Set</title>
<link rel="stylesheet" type="text/css" href="mainStyle.css">
</head>
<body>
<div id="banner" class="banner">
<h1> Welcome to the home of our OpenGL chess set! </h1>
</div>

<div id="wrapper" class="wrapper">

<div id="sidebar" class="menuBar">
<div id="ele1" class="menuElement"><a href="theTeam.html">The Team</a></div>
<div id="ele2" class="menuElement"><a href="theProject.html">The Project</a></div>
<div id="ele3" class="menuElement"><a href="contact.html">Contact</a></div>
<div id="ele4" class="menuElement"><a href="download.html">Download!</a></div>
</div>

<div id="mainContent" class="content">
<h1> Welcome, this is a webpage dedicated to our team's end of term project: a chess set designed using openGL and C++. </h1>
</div>

<div>
<iframe width="640" height="360" src="//www.youtube.com/embed/QGRW7YJa4cg" frameborder="0" allowfullscreen></iframe>
</div>

</div>

</body>
</html>

css看起来像这样：

div.banner
{
display: flex;
align-items: center;
justify-content : center;

color:white;
font-size:large;

background-color:#606060;

height: 100px;
border: 10px groove black;
}

div.wrapper
{
height:1000px;

}

div.menuBar
{
color:white;
font-size:large;

float:left;

background-color:#606060;

width: 160px;
height: 1000px;
}

div.menuElement
{
display: flex;
align-items: center;
justify-content : center;

float:left;
color:white;
font-size:large;

width: 140px;
height: 180px;
border: 10px groove black;
}

div.content
{
display: flex;
justify-content : center;

color:Black;
}

p.center
{
font-size: xx-large;
text-align:center;
}

相当确定两者都没有问题，至少与iFrame无法正常工作有关，但比抱歉更安全。我完全难过了。所以，至少在我的最后发生了什么。除了播放器之外，网页完全加载。从来没有加载，我最终（使用我的页面作为一个例子）谈论国际象棋的标题设置他们下面的空内容div。在使用inspect elements选项之前，我甚至都没有获得播放器的边框。

非常感谢任何帮助！

此致格雷格

Answer 1

在iframe尝试在src值上添加“https”，就像这样：

<iframe width="560" height="315" src="https://www.youtube.com/embed/QGRW7YJa4cg" frameborder="0" allowfullscreen></iframe>

Youtube嵌入iFrame没有出现

1 个答案: