Question

我使用的是SASS，我是新手，但我遇到了问题。从文档中，我听起来需要编辑_top-bar.scss并添加一行说：$ topbar-menu-icon-position：$ default-float; （与$反向相反;）。

但这似乎不起作用 - 汉堡菜单图标继续在移动设备上正确对齐。

我很确定问题不在于HTML代码，但以防万一：

<nav class="top-bar" data-topbar>
  <ul class="title-area">
    <li class="name">
      <h1><a href="#">Name</a></h1>
    </li>
    <li class="toggle-topbar menu-icon">
      <a href="#"><span>menu</span></a>
    </li>
  </ul>
  <section class="top-bar-section">
    <ul class="left">
      <li><a href="#">Link 1</a></li>
      <li><a href="#">Link 2</a></li>
      <li><a href="#">Link 3</a></li>
    </ul>
  </section>
</nav>

Answer 1

如果你看here

你会看到一个顶部栏位置

   $topbar-menu-icon-position: $opposite-direction !default; // Change to $default-float for a left menu icon

基本上你需要把它改成

  $topbar-menu-icon-position: $default-float !default;

我建议将其添加到您的本地sass而不是编辑原始文件，以便将来可以轻松升级。

如何在Foundation中左对齐汉堡包菜单

1 个答案: