基礎漢堡包不顯示

我嘗試過，但漢堡包不顯示「菜單」。我正在使用Foundation 6並在Opera，Firefox，Chrome和Edge上進行測試。基礎漢堡包不顯示

<!DOCTYPE html> 
<html> 

    <head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
    <title>Foundation</title> 
    <link rel="stylesheet" href="stylesheets/app.css" /> 
    <script src="bower_components/modernizr/modernizr.js"></script> 
    </head> 
    <body> 
    <body> 
     <div class="contain-to-grid sticky"> 
      <nav class="top-bar" data-topbar> 
       <ul class="title-area"> 
        <li class="name"><h1><a href="#"><span>My Website</span></a></h1></li> 
        <li class="toggle-topbar menu-icon"><a href="#">Menu</a></li> 
       </ul> 
      </nav> 
     </div> 

      <script src="bower_components/jquery/dist/jquery.min.js"></script> 
    <script src="bower_components/foundation/js/foundation.min.js"></script> 
    <script src="js/app.js"></script> 
    </body> 
</html>

來源

2016-01-07 John John

基金會大師任何解決方案？ –

您已打開<body>標記兩次。請嘗試以下操作：

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
    <title>Foundation</title> 
    <link rel="stylesheet" href="stylesheets/app.css" /> 
    <script src="bower_components/modernizr/modernizr.js"></script> 
    </head> 
    <body> 
    <div class="contain-to-grid sticky"> 
     <nav class="top-bar" data-topbar> 
      <ul class="title-area"> 
       <li class="name"><h1><a href="#"><span>My Website</span></a></h1></li> 
       <li class="toggle-topbar menu-icon"><a href="#">Menu</a></li> 
      </ul> 
     </nav> 
    </div> 
    <script src="bower_components/jquery/dist/jquery.min.js"></script> 
    <script src="bower_components/foundation/js/foundation.min.js"></script> 
    <script src="js/app.js"></script> 
    </body> 
</html>

檢查您的CSS，如果漢堡適當的樣式，並檢查漢堡包文件是否存在。這可能是由於某些原因，很難用提供的代碼來識別原因。

來源

2016-01-07 06:28:19

感謝邁漢，我固定了身體標籤，但漢堡仍然失蹤。 –

這可能是由於某些原因，如果您添加了正確的樣式來加載漢堡包，請檢查您的CSS文件，並檢查漢堡包是否存在。你有網上鍊接檢查它？ –

這裏是顯示..

請確認如果調用腳本/ css是正確的。

<html> 

<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
    <title>Foundation</title> 
    <link rel="stylesheet" href="stylesheets/app.css" /> 
</head> 

<body> 
    <div class="contain-to-grid sticky"> 
    <nav class="top-bar" data-topbar> 
     <ul class="title-area"> 
     <li class="name"> 
      <h1> 
      <a href="#"><span>My Website</span></a></h1> 
     </li> 
     <li class="toggle-topbar menu-icon"> 
      <a href="#"></a> 
     </li> 
     </ul> 
    </nav> 
    </div> 
    <script src="bower_components/jquery/dist/jquery.min.js"></script> 
    <script src="bower_components/foundation/js/foundation.min.js"></script> 
    <script src="js/app.js"></script> 
</body> 

</html>

http://codepen.io/fabiovaz/pen/vLmEVw

來源

2016-01-07 18:08:12 fabiovaz

你有沒有包含在app.scss文件的基礎上的圖標？如果不添加此行：

@include foundation-menu-icon;

來源

2016-10-20 12:25:54 Lukas

基礎漢堡包不顯示

回答

相關問題