页眉和页脚之间的视频

Question

我的混乱代码需要一些帮助（请原谅我有很多母语文本）。我需要将 IFRAME 安装在网站的页眉和页脚之间，这样它在每个显示器（分辨率）上看起来都一样。谢谢！

body {
margin: 0;
background-image: linear-gradient(to right, #292c33, #a0b2d0, #dee9f6, #a0b2d0, #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>

希望大家能分清什么是footer，head等等，我实在是还不太会coding，哈哈。谢谢你的帮助！

Answer 1

根据评论，您只是想 center 一个 iframe。 iframe中的I代表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>

页眉和页脚之间的视频

Video in between Head and Footer

html

css

video