如何使用divs制作完整的背景图片

时间：2019-01-30 14:54:55

标签： html css

在第一页上（是开始按钮）应该是带有文本“ Start de reis”和橙色开始按钮的图像。但是我不知道我在做什么错。

在我的代码段中，文本和背景文本为白色，因此由于某种原因您看不到我网站的其余部分，但这对希望并不重要。

有人可以帮忙吗？如果是这样，非常感谢。

  body {
      position: relative;
      background-color: black;
      height: 100%;
  }

  #section1 {
      height: auto;
      color: #fff;
      background-color: transparent;
  }

  #section2 {
      padding-top: 50px;
      height: auto;
      color: #fff;
      background-color: transparent;
  }

  #section3 {
      padding-top: 50px;
      height: auto;
      color: #fff;
      background-color: transparent;
  }

  #section41 {
      padding-top: 50px;
      height: auto;
      color: #fff;
      background-color: transparent;
  }

  #section42 {
      padding-top: 50px;
      height: auto;
      color: #fff;
      background-color: transparent;
  }

  .voorstellen {
      max-width: 35%;
      font-size: 20px;
      color: white;
      margin: 0 auto;
      font-family: "Roboto"sans-serif;
      position: center;
      text-transform: none;
  }

  h1.startdereis {
      /* tekst met start de reis */
      color: white;
      text-transform: uppercase;
      font-size: 70px;
      text-align: center;
      font-family: sans-serif;
      z-index: 100;

  }

  .knop {
      /* start knop */
      margin-left: 100%;
      z-index: 100;
  }

  .knop1 {
      /* start knop*/
      border: 3px solid white;
      padding: 10px 30px;
      color: white;
      text-decoration: none;
      margin-right: 5px;
      font-size: 13px;
      text-transform: uppercase;
      background-color: darkorange;
      font-family: "Roboto", sans-serif;
      margin-left: -300px;
  }

  .a12345 {
      background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)) url(https://i.ibb.co/WppGWkx/straat.jpg);
    height: 100%; 
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

  .logo {
      width: 100px;
      height: auto;
      filter: brightness(0) invert(1);
      float: left;
      margin-left: 2%;
  }

.container {
  position: relative;
  text-align: center;
  color: white;
}

.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
<!DOCTYPE html>
<html>

<head>
    <title>Bootstrap Example</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="style3.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>


<body data-spy="scroll" data-target=".navbar" data-offset="50">

    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container-fluid">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#"><img class="logo" src="http://www.pngonly.com/wp-content/uploads/2017/06/Lion-Tattoo-Clipart-PNG-Image-03.png"> </a>
            </div>
            <div>
                <div class="collapse navbar-collapse" id="myNavbar">
                    <ul class="nav navbar-nav">
                        <li><a href="#section1">Home</a></li>
                        <li><a href="#section2">Voorstellen</a></li>
                        <li><a href="#section3">Hobby's</a></li>
                        <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Toekomstdromen <span class="caret"></span></a>
                            <ul class="dropdown-menu">
                                <li><a href="#section41">Toekomstdromen</a></li>
                                <li><a href="#section42">About</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </nav>

    <div id="section1" class="container-fluid">

        <div class="container">
            <div class="a12345"></div>
            <div class="centered">
                <h1 class="startdereis">Start De Reis</h1>
                <div class="knop">
                    <a href="#section2" class="knop1"> Start </a>
                </div>
            </div>
        </div>
    </div>

    <div id="section2" class="container-fluid">
        <div class="voorstellen">

            <h2>Wie ben ik?</h2>
            <p>
                Mijn volledige naam is Duco Gerard van de Schepop. Mijn tweede naam komt van mijn hele muzikale opa, die ik helaas nooit gekent heb. Op het moment dat ik werd geboren had ik geen opa's meer en nog maar een oma. Mijn enige oma die nog leefde woonde
                in Duitsland. We zochten haar meestal om de vakantie op. Voor mij was het meestal best saai want ik sprak toen ik klein was nog geen Duits, dus was het moeilijk om met mijn oma te praten en in een bejaardenhuis is nou eenmaal weinig te doen. Toen
                ik in de tweede klas wat Duits had geleerd en zover was om zelf een gesprek met mijn oma aan tegaan i.p.v dat mijn ouder het zouden vertalen stierf mijn rond die tijd jammer genoeg.
                <br><br>
                Het was misschien al een beetje duidelijk maar ik heb dus een familie die dus uit Duitsers en uit Nederlanders bestaat. Contact hebben met de Duitse kant van de familie is erg lastig omdat het best een stuk rijden is naar Duitsland. Als
                ik dus tijd doorbreng met famillie is het meestal met de famillie uit Nederland, wat ik eigenlijk niet heel erg vindt. Ik heb een hele leuke familie en daar ben ik erg blij mee.
                <br><br>
                Nu even genoeg over mijn opa's en oma's. Ik woon vijtien jaar in Soest met mijn vader, moeder en sinds dat ik drie werd ook een kleiner zusje. Er is niet echt iets bijzonders dat ik kan vertellen over mijn gezin, we zijn gewoon gewoontjes.
                Ikzelf zit op dit moment in de vierde klas op Het Baarnsch Lyceum. Mijn paket is NT en het gaat me wel goed af. De school vindt zelf dat ik het zo goed doe dat ik drie uur in de week niet meer hoef te komen. Heel bijzonder is het ook weer niet want
                die uren waren toch een soort van tussenuren. De bedoeling is dat je in deze uren, waar ik dus niet meer heen ga, huiswerk kan/moet maken dit doet alleen bijna niemand en iedereen zit eigenlijk gewoon te wachten totdat het saaie uur voorbij is.
                <br><br>
                Ik hoop dat ik nu genoeg over mezelf heb verteld en dat je nu al beter weet wie ik ben. Ik weet dat ik niet een heel spannend vaarhaal heb maarja, ik moet nou eenmaal een blog maken hè.
            </p>
        </div>
    </div>


    <div id="section3" class="container-fluid">
        <div class="voorstellen">
            <h2>Mijn hobby's</h2>
            <p>
                Toen ik in groep vijf zat vonden mijn ouders het maar een tijd dat ik op een sport ging. Op dat moment zat ik op scouting waar ik toen iedere zaterdag naar toe ging. Via een kies je sport folder ben ik op klimmen gekomen. Dit vond ik tijdens de proeflessen erg leuk maar al snel werd het saaier en saaier dus daar was ik snel weer van af. Vervolgens ben ik op honkbal gegaan, hier zit ik tot de dag van vandaag nog steeds op en ik heb nog steeds veel plezier tijdens het honkballen. Een sport vinden die ik leuk vond en een sport waar je niet snel geblesseerd kan raken, want ik raak heel snel geblesseerd, was heel erg moeilijk. Daarom ben ik dan ook heel erg blij dat ik honkbal heb geprobeerd.
                <br><br>
                Naast honkbal heb ik nog andere hobby's, vooral achter de computer of op de televisie. Ik vind het namelijk erg leuk om te gamen. Ik heb ook iets van tien verschillende spellen. Hier een klein lijstje van enkele populaire spellen die ik speel:
            </p>
            <ul>
                <li>Overwatch</li>
                <li>GTA V</li>
                <li>Fortnite</li>
            </ul>
            <p>
                Ook vind ik het heel fijn om af en toe een Netflix film te kijken of om een YouTube video te kijken.
                <br><br>
                De laatste hobby maar wel een van de leukste is piano spelen. Ik speel al sinds dat ik klein ben piano en tot de dag van vandaag ben ik er druk mee bezig. Toen ik kleiner was voelde het meer als een verplichting en was ik niet zo gemotiveerd maar nu ik wat ouder ben kan ik meer mijn eigen smaak uitkiezen en krijg ik meer plezier met piano spelen.
            </p>
        </div>
    </div>


    <div id="section41" class="container-fluid">
        <div class="voorstellen">
            <p>
                lorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsum
            </p>
        </div>
    </div>

    <div id="section42" class="container-fluid">
        <div class="voorstellen">
            <p>
                lorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsum
            </p>
        </div>
    </div>

</body>

</html>

3 个答案:

答案 0 :(得分：0)

只需尝试一下，您需要将高度分配给div＃section1 

InitializingBean

并且背景图像语法不正确

init

您还需要检查所有元素的高度，因为它们的高度有问题

答案 1 :(得分：0)

我认为您的“ body” CSS已被删除，因为此代码段已嵌入-我做了一个小小的更改，以应用这些样式，以便在此处查看它们。

接下来，我在<h1>标记中看到了文本-并不是您所说的图像，但是我认为那是您的意思。 <h1>标记以及其他所有内容都从导航栏下方页面的顶部开始。有多种方法可以解决此问题，并且可能取决于网站其余部分的外观，这是更好的方法，但是一种简单而快速的方法是在#section1上添加页边距。

“开始”按钮下方还有其他一些文本需要修复，但希望这可以使您走上正确的轨道。 

  #section1 {
    margin-top: 80px;
  }
  #body {
      position: relative;
      background-color: black;
      height: 100%;
  }

  #section1 {
      height: auto;
      color: #fff;
      background-color: transparent;
  }

  #section2 {
      padding-top: 50px;
      height: auto;
      color: #fff;
      background-color: transparent;
  }

  #section3 {
      padding-top: 50px;
      height: auto;
      color: #fff;
      background-color: transparent;
  }

  #section41 {
      padding-top: 50px;
      height: auto;
      color: #fff;
      background-color: transparent;
  }

  #section42 {
      padding-top: 50px;
      height: auto;
      color: #fff;
      background-color: transparent;
  }

  .voorstellen {
      max-width: 35%;
      font-size: 20px;
      color: white;
      margin: 0 auto;
      font-family: "Roboto"sans-serif;
      position: center;
      text-transform: none;
  }

  h1.startdereis {
      /* tekst met start de reis */
      color: white;
      text-transform: uppercase;
      font-size: 70px;
      text-align: center;
      font-family: sans-serif;
      z-index: 100;

  }

  .knop {
      /* start knop */
      margin-left: 100%;
      z-index: 100;
  }

  .knop1 {
      /* start knop*/
      border: 3px solid white;
      padding: 10px 30px;
      color: white;
      text-decoration: none;
      margin-right: 5px;
      font-size: 13px;
      text-transform: uppercase;
      background-color: darkorange;
      font-family: "Roboto", sans-serif;
      margin-left: -300px;
  }

  .a12345 {
      background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(https://i.ibb.co/WppGWkx/straat.jpg);
    height: 100px; 
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

  .logo {
      width: 100px;
      height: auto;
      filter: brightness(0) invert(1);
      float: left;
      margin-left: 2%;
  }

.container {
  position: relative;
  text-align: center;
  color: white;
}

.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
<!DOCTYPE html>
<html>

<head>
    <title>Bootstrap Example</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="style3.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>


<body id="body" data-spy="scroll" data-target=".navbar" data-offset="50">

    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container-fluid">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#"><img class="logo" src="http://www.pngonly.com/wp-content/uploads/2017/06/Lion-Tattoo-Clipart-PNG-Image-03.png"> </a>
            </div>
            <div>
                <div class="collapse navbar-collapse" id="myNavbar">
                    <ul class="nav navbar-nav">
                        <li><a href="#section1">Home</a></li>
                        <li><a href="#section2">Voorstellen</a></li>
                        <li><a href="#section3">Hobby's</a></li>
                        <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Toekomstdromen <span class="caret"></span></a>
                            <ul class="dropdown-menu">
                                <li><a href="#section41">Toekomstdromen</a></li>
                                <li><a href="#section42">About</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </nav>

    <div id="section1" class="container-fluid">

        <div class="container">
            <div class="a12345"></div>
            <div class="centered">
                <h1 class="startdereis">Start De Reis</h1>
                <div class="knop">
                    <a href="#section2" class="knop1"> Start </a>
                </div>
            </div>
        </div>
    </div>

    <div id="section2" class="container-fluid">
        <div class="voorstellen">

            <h2>Wie ben ik?</h2>
            <p>
                Mijn volledige naam is Duco Gerard van de Schepop. Mijn tweede naam komt van mijn hele muzikale opa, die ik helaas nooit gekent heb. Op het moment dat ik werd geboren had ik geen opa's meer en nog maar een oma. Mijn enige oma die nog leefde woonde
                in Duitsland. We zochten haar meestal om de vakantie op. Voor mij was het meestal best saai want ik sprak toen ik klein was nog geen Duits, dus was het moeilijk om met mijn oma te praten en in een bejaardenhuis is nou eenmaal weinig te doen. Toen
                ik in de tweede klas wat Duits had geleerd en zover was om zelf een gesprek met mijn oma aan tegaan i.p.v dat mijn ouder het zouden vertalen stierf mijn rond die tijd jammer genoeg.
                <br><br>
                Het was misschien al een beetje duidelijk maar ik heb dus een familie die dus uit Duitsers en uit Nederlanders bestaat. Contact hebben met de Duitse kant van de familie is erg lastig omdat het best een stuk rijden is naar Duitsland. Als
                ik dus tijd doorbreng met famillie is het meestal met de famillie uit Nederland, wat ik eigenlijk niet heel erg vindt. Ik heb een hele leuke familie en daar ben ik erg blij mee.
                <br><br>
                Nu even genoeg over mijn opa's en oma's. Ik woon vijtien jaar in Soest met mijn vader, moeder en sinds dat ik drie werd ook een kleiner zusje. Er is niet echt iets bijzonders dat ik kan vertellen over mijn gezin, we zijn gewoon gewoontjes.
                Ikzelf zit op dit moment in de vierde klas op Het Baarnsch Lyceum. Mijn paket is NT en het gaat me wel goed af. De school vindt zelf dat ik het zo goed doe dat ik drie uur in de week niet meer hoef te komen. Heel bijzonder is het ook weer niet want
                die uren waren toch een soort van tussenuren. De bedoeling is dat je in deze uren, waar ik dus niet meer heen ga, huiswerk kan/moet maken dit doet alleen bijna niemand en iedereen zit eigenlijk gewoon te wachten totdat het saaie uur voorbij is.
                <br><br>
                Ik hoop dat ik nu genoeg over mezelf heb verteld en dat je nu al beter weet wie ik ben. Ik weet dat ik niet een heel spannend vaarhaal heb maarja, ik moet nou eenmaal een blog maken hè.
            </p>
        </div>
    </div>


    <div id="section3" class="container-fluid">
        <div class="voorstellen">
            <h2>Mijn hobby's</h2>
            <p>
                Toen ik in groep vijf zat vonden mijn ouders het maar een tijd dat ik op een sport ging. Op dat moment zat ik op scouting waar ik toen iedere zaterdag naar toe ging. Via een kies je sport folder ben ik op klimmen gekomen. Dit vond ik tijdens de proeflessen erg leuk maar al snel werd het saaier en saaier dus daar was ik snel weer van af. Vervolgens ben ik op honkbal gegaan, hier zit ik tot de dag van vandaag nog steeds op en ik heb nog steeds veel plezier tijdens het honkballen. Een sport vinden die ik leuk vond en een sport waar je niet snel geblesseerd kan raken, want ik raak heel snel geblesseerd, was heel erg moeilijk. Daarom ben ik dan ook heel erg blij dat ik honkbal heb geprobeerd.
                <br><br>
                Naast honkbal heb ik nog andere hobby's, vooral achter de computer of op de televisie. Ik vind het namelijk erg leuk om te gamen. Ik heb ook iets van tien verschillende spellen. Hier een klein lijstje van enkele populaire spellen die ik speel:
            </p>
            <ul>
                <li>Overwatch</li>
                <li>GTA V</li>
                <li>Fortnite</li>
            </ul>
            <p>
                Ook vind ik het heel fijn om af en toe een Netflix film te kijken of om een YouTube video te kijken.
                <br><br>
                De laatste hobby maar wel een van de leukste is piano spelen. Ik speel al sinds dat ik klein ben piano en tot de dag van vandaag ben ik er druk mee bezig. Toen ik kleiner was voelde het meer als een verplichting en was ik niet zo gemotiveerd maar nu ik wat ouder ben kan ik meer mijn eigen smaak uitkiezen en krijg ik meer plezier met piano spelen.
            </p>
        </div>
    </div>


    <div id="section41" class="container-fluid">
        <div class="voorstellen">
            <p>
                lorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsum
            </p>
        </div>
    </div>

    <div id="section42" class="container-fluid">
        <div class="voorstellen">
            <p>
                lorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsum
            </p>
        </div>
    </div>

</body>

</html>

答案 2 :(得分：0)

您的导航栏是固定的，因此您的＃section1在导航栏下方。这样，您就有2个选项可以更正它：

1）

.navbar {
        margin-bottom:40px; //or bigger
        }

或

2）

#section1 {
          margin-top: 40px; //or bigger
          }
相关问题
最新问题