Question

我的导航栏使用position: sticky，但因为正文不会比视频更进一步。其他元素是漂浮的，但它们不会以某种方式进入体内当我使用包装器时，所有代码都在正文中，但导航栏不再粘。我试过溢出auto和所有但它不起作用。这是我的代码：

body {
  background-image: url(bf1.jpg);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  margin: 0;
  font-family: roboto, sans-serif;
}

header img {
  margin: auto;
  width: 30vw;
  height: 10vh;
  display: block;
}

header {
  margin: 0;
  clear: both;
}

nav {
  width: 100%;
  height: 8vh;
  background-color: black;
  margin: 0;
  position: sticky;
  top: 0;
  clear: both;
}

nav ul {
  margin: 0;
  list-style: none;
  text-align: center;
}

nav li {
  display: inline-block;
  margin: 2vh 2vw 0px 2vw;
}

nav a {
  color: white;
  font-size: 1.25em;
  text-decoration: none;
}

nav a:hover {
  color: #FF5D09;
}

#huidig {
  color: #FF5D09;
}

#trailer {
  width: 100%;
  margin: 1% 0%;
  clear: both;
}

#trailer iframe {
  width: 50vw;
  height: 60vh;
  margin: 0 auto;
  display: block;
  border: solid black 4px;
}

article {
  color: white;
  height: auto;
  width: 70vw;
  float: left;
  font-size: 110%;
  text-align: center;
}

<header> <img src="header.png" /> </header>

<nav>
  <ul>
    <li><a id="huidig" href="home.html">Home</a></li>
    <li><a href="they shall not pass.html">They Shall Not Pass</a></li>
    <li><a href="in the name of the tsar.html">In the Name of the Tsar</a></li>
    <li><a href="community.html">Community</a></li>
  </ul>
</nav>

<div id="trailer">
  <iframe src="https://www.youtube.com/embed/zOKZtgsUCtc?rel=0" frameborder="0" allowfullscreen></iframe>
</div>

<article>
  <div id="Intro">
    <h2> Introductie</h2>
    <p>Battlefield 1 is een first person shooter ontwikkeld door EA DICE. Ondanks de 1 is het de 15e game in de series. In tegenstelling tot de voorganger speelt Battlefield 1 zich af in de 1e wereldoorlog. Wat Battlefield 1 (eigenlijk de hele Serie) nou
      bijzonder maakt, in vergelijking met de competitie, is het feit dat het voertuigen bevat die spelers zelf kunnen besturen. Verder bevat het spel veel grotere maps dan de concurrenten.
    </p>
  </div>

  <img src="pic1home.jpg" />

  <div id="Singleplayer">
    <h2>Singleplayer</h2>
    <p>Voor Battlefield 1 heeft de developer gekozen voor een andere soort storyline dan ze altijd hebben gedaan. In de vorige titels waren het altijd opeenvolgende missies die je moest doen. Het perspectief was altijd vanuit één persoon en het was een tradionele
      singleplayer, zoals de andere shooters. Bij Battlefield 1 hebben ze nu war stories. In plaats van een reeks missies, speel je nu als het ware meerdere kleine singleplayers. Je kunt het zien als hoofstukken, elk hoofstuk heeft een paar missies die
      het verhaal van de hoofdpersonage vertellen. Je speelt daardoor ook niet als één persoon, maar als meerdere tijdens de eerste wereldoorlog.
    </p>
    <table>
      <tr>
        <th>War Story</th>
        <th>Hoofdpersonage</th>
        <th>Thema</th>
      </tr>
      <tr>
        <td>Through Mud and Blood</td>
        <td>Daniel Edwards</td>
        <td>Mark V tank</td>
      </tr>
      <tr>
        <td>Friends in high places</td>
        <td>Clyde Blackburn</td>
        <td>Luchtgevechten </td>
      </tr>
      <tr>
        <td>Avanti Savoia</td>
        <td>Luca Vincenzo</td>
        <td>zoektocht</td>
      </tr>
      <tr>
        <td>The Runner</td>
        <td>Frederick Bishop</td>
        <td>vriendschap <br/>opoffering </td>
      </tr>
      <tr>
        <td>Nothing is Written</td>
        <td>Zara Ghufran</td>
        <td>Pantsertrein <br/> vrijheid</td>
      </tr>
    </table>
  </div>

  <div id="multiplayer">
    <h2>Multiplayer</h2>
    <p>De multiplayer van Battlefield 1 is voor veel mensen de reden om het spel te kopen. Het bevat voertuigen zoals tanks, vliegtuigen en boten en gedetailleerde omgevingen. Elk voertuig heeft 3 variaties die je kunt kopen. Elke variate geeft het voertuig
      andere wapens, zodat het meer anti-tank focussed is of juist goed for infanterie. Een nieuw gameplay element in Battlefield 1 is de behemoth. Als een team dreigth te verliezen met een groot verschil krijgt het toegang tot een speciaal voertuig om
      een comeback te maken. Het voertuig verschilt per map en kan een armored train zijn, maar ook een enorme zeppelin.</p>
  </div>
</article>

<div id="sidenav">
  <ul>
    <li><a href="#Intro">Introductie</a></li>
    <li><a href="#Singleplayer">singleplayer</a></li>
  </ul>
</div>

Answer 1

哦，我提出了最愚蠢的问题。抱歉浪费你的时间。我感谢你的帮助。问题是身体崩溃了，我做了一个明确的测试页脚：两者都解决了问题。再次抱歉发布了这个愚蠢的东西。

大部分内容都在身体之外

1 个答案: