Html 页边距顶部div导致固定页眉div向下移动_Html_Css

Html 页边距顶部div导致固定页眉div向下移动

html css

Html 页边距顶部div导致固定页眉div向下移动,html,css,Html,Css,我想给我的网页的内容，是在标题下，一个70像素的页边空白顶部，所以它去下面的标题。割台位置：固定；这就是为什么我需要页面内容的页边空白顶部然而，当我给出最高利润率：70px；对于页面内容，它也会将标题向下移动70像素。你知道为什么吗？代码如下： HTML: 我想你忘了给标题加一个顶部：0 我想你忘了给标题加一个顶部：0 或者，您可以使用填充代替边距作为快速修复。或者，您可以使用填充代替边距作为快速修复。正确。可在8分钟内标记为溶液。我以为它会默认为top:0；但我想如果你对为什么会发生这种情况

我想给我的网页的内容，是在标题下，一个70像素的页边空白顶部，所以它去下面的标题。割台位置：固定；这就是为什么我需要页面内容的页边空白顶部

然而，当我给出最高利润率：70px；对于页面内容，它也会将标题向下移动70像素。你知道为什么吗？代码如下：

HTML:

我想你忘了给标题加一个顶部：0

或者，您可以使用填充代替边距作为快速修复。

正确。可在8分钟内标记为溶液。我以为它会默认为top:0；但我想如果你对为什么会发生这种情况感兴趣，这里有一个类似的问题：正确。可在8分钟内标记为溶液。我以为它会默认为top:0；但我想如果你对为什么会发生这种情况感兴趣，这里有一个类似的问题：

<body>
        <div class="header" style="position: fixed; width:100%;">
        <a href="http://www.w3schools.com" >
            <h5 id="app-name" 
                class="nav-item clickable white-text medium-text left-text">
                THE VEGAN REPOSITORY
            </h5>
        </a>
        <a href="http://www.w3schools.com" >
            <h5     (click)="clicked()" id="sign-in-button" 
                    class="nav-item clickable brand-colour-text medium-text right-text with-border">
                    SIGN UP FREE
            </h5>
        </a>
        <a href="http://www.w3schools.com" >
            <h5 class="nav-item clickable white-text medium-text right-text">LOGIN</h5>
        </a>
        <a href="#home_page_footer" >
            <h5 class="nav-item clickable white-text medium-text right-text" >BLOG</h5>
        </a>
        <a href="#home_page_footer" >
            <h5 class="nav-item clickable white-text medium-text right-text" >ABOUT</h5>
        </a>
    </div>
        <div style="margin-bottom: 100px;margin-top:70px;" class="full-size dimmed">
            <div style="z-index: -1;">
                <video 
                    style="position:fixed;" 
                    autoplay loop muted
                    poster="assets/images/home_page/polina.jpg" 
                    id="bgvid">
                    <!--<source src="polina.webm" type="video/webm">-->
                    <source src="assets/videos/polina.mp4" type="video/mp4">
                </video>
            </div>

            <div id="motto-text" class="vertical-center" >
                <h5 class="white-text medium-text">THE VEGAN REPOSITORY</h5>
                <h1 id="main-text" 
                    class=" text-center white-text light-text extra-large-text">
                    FIND VEGAN PRODUCTS NEAR YOU
                </h1>
                <a  id="try-now-button" 
                    class="with-border clickable" 
                    href="#find-vegan-products-page" >
                    <h5 style="font-size:16px" class=" text-center medium-text">TRY NOW</h5>
                </a>
            </div>
        </div>

.header {
    height: 70px;
    background: #002B03;
}

.full-size {
  height: 100%;
  background-size: cover; 
}

.dimmed:after {
  content: " ";
  z-index: -1;
  display: block;
  position: absolute;
  height: 300%;
  top: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, .5);
}


video#bgvid { 
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background: url(../assets/images/home_page/polina.jpg) no-repeat;
    background-size: cover; 
}

/*for ie 9*/
video { display: block; }

@media screen and (max-device-width: 800px) {
    html {
         background: url(../assets/images/home_page/polina.jpg) #000 no-repeat center center fixed;
    }
    #bgvid {
        display: none;
    }
}

.header {
  position:fixed;
  left:0;
  top:0;
  width:100%;
  height: 70px;
  background: #002B03;
}