如何解决页眉和页脚之间的视频
我需要一些帮助来处理我凌乱的代码(请原谅我的母语中有很多文本)。我需要在网站的页眉和页脚之间安装 IFRAME,所以它在每个显示器上看起来都一样(分辨率)。 谢谢!
body {
margin: 0;
background-image: linear-gradient(to right,#292c33,#a0b2d0,#dee9f6,#292c33);
}
p{
color: #272727;
text-align: left;
display: block;
font-family: 'Montserrat',sans-serif;
padding-left: 14px;
font-size: 12px;
text-decoration: none;
// nadefinování písma na stránce
}
.nav{
background-color: #eaeaea;
overflow: hidden;
}
.nav a{
float: left;
display: block;
color: #272727; // barva fontu
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 100%;
border-bottom: 3px solid transparent;
font-family: 'Montserrat',sans-serif;
height: 30px;
}
.nav a:hover{
border-bottom: 3px solid #310a0b;
}
.nav a.active{
border-bottom: 3px solid #b50c0f;
}
.fotka{
display: block;
float: right;
width: 5%;
height: 5%;
margin: 12px;
}
footer{
padding: 1px;
background-color: #eaeaea;
color: #272727;
font-family: 'Montserrat',sans-serif;
font-size: 12px;
position: fixed;
bottom: 0;
width: 100%;
}
.zvideo{
display: block;
margin-left: auto;
margin-right: auto;
padding-top: 0%;
}
<!DOCTYPE html>
<html lang="cs">
<head>
<Meta charset="utf-8">
<Meta name="viewport" content="width=device-width,initial-scale=1">
<link rel='icon' href='favicon.ico?' type='image/x-icon'/>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Montserrat&display=swap" rel="stylesheet">
<title>Hlavní stránka</title>
</head>
<body>
<div class="nav">
<a class="active" href="index.html">Domů</a>
<a href="Druha.html">Zaklínač</a>
<a href="Treti.html">Hry</a>
<a href="Ctvrta.html">Knížky</a>
<img class="fotka" alt="logo stránky" src="logo.png">
</div>
<!--NÁSLEDUJE DIV IFRAMU-->
<div class="zvideo">
<iframe class="zvideo" src="https://www.youtube.com/embed/hquuwfa3FCo?autoplay=1&mute=1" width="1152px" height="648px" frameborder="0" allow="autoplay"></iframe>
</div>
<footer>
<p>Autor: Jan Michalisko</p>
<p>Můj email: hachikolp@gmail.com</p> <!--mailto: mi přišel velmi barbarský,takže jsem tam nechal jenom paragraf-->
</footer>
</body>
</html>
我希望你能识别出页脚、头部等是什么,我真的不擅长编码,哈哈。感谢您的帮助!
解决方法
根据评论,您只是想 center
一个 iframe
。 I
中的 iframe
代表 inline
。因此,<iframe>
标记的正确名称是:inline frame
。顾名思义,它不是block level element
而是inline element
。因此,默认情况下不能使用 margin: 0 auto;
居中。因此,您需要先添加 display: block;
,以便将 iframe
更改为 block level element
。
iframe {
display: block;
margin: 0 auto;
background-color: blue;
}
<iframe src="">Just a Test</iframe>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。