Question

我想为我的网站编写导航栏代码。它应该支持移动和桌面视图。现在我想在导航中添加div并且它不起作用，但是当我使用firefox中的inspecting元素分析它并刷新它的网站时它可以工作。任何人都可以帮助我吗？

以下是导航的代码段：

＆＃13;

/* Here is the css declaration of the drop class: */

.drop {
  width: 50px;
  height: 50px;
  background-color: #FFFFFF;
  cursor: pointer;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

＆＃13;

<nav class="nav" id='navigation'>
  <ul style="font: normal 14px Tauri, serif ">


    <li style="float: left; border: none ">
      <a href='index.php'>test</a>
    </li>


    <button class="drop"></button>

＆＃13;

Answer 1

实际上有一个＆＃34; nav＆＃34;但它没有高度。我做了一个小提琴，我添加了一些高度和背景颜色，也删除了身体边缘，检查出来！

https://jsfiddle.net/tu9rh3sg/

这适用于HTML（我刚关闭导航）：

 <nav class="nav" id='navigation'>
  <ul style="font: normal 14px Tauri, serif ">


    <li style="float: left; border: none ">
      <a href='index.php'>test</a>
    </li>


    <button class="drop"></button>
    </nav>

这是CSS（高度+背景颜色+边距）;

    .drop {
  width: 50px;
  height: 50px;
  background-color: #FFFFFF;
  cursor: pointer;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}
.nav {
  background-color: black;
  height: 50px;
}
body {
  margin: 0 auto;
  margin-top: -14px;
}

告诉我它是否有帮助！ ☻

导航中的类仅适用于firefox中的inspecting元素

1 个答案: