Question

我无法让我的基金会下拉按钮工作（看起来CSS没有正确加载）。我已经尝试了各种方法来实现按钮，包括以下代码，这些代码或多或少地从基金会网站剪切和粘贴：

<!doctype html>
<html class="no-js" lang="en"> 
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Foundation | Welcome</title>
<link rel="stylesheet" href="css/foundation.css" />
<script src="js/vendor/modernizr.js"></script>
</head>
  <body>
<div href="#" class="large button dropdown">
  Dropdown Button
  <ul>
    <li><a href="#">Dropdown Item</a></li>
    <li><a href="#">Another Dropdown Item</a></li>
    <li class="divider"></li>
    <li><a href="#">Last Item</a></li>
  </ul>
</div>
<script src="js/vendor/jquery.js"></script>
<script src="js/foundation.min.js"></script>
<script src="js/foundation/foundation.dropdown.js"></script>
<script>
  $(document).foundation();
</script>
</body>
</html>

最终结果如下：

http://i.imgur.com/QZvHKDW.png

（我没有足够的声誉直接发布图片 - 抱歉）

为了清楚起见，我确保链接正确无误，并且还尝试使用CDN来确保它不是链接问题。

Chrome控制台没有错误，与gulp同上。

有谁知道我做错了什么？

Answer 1

您的按钮是代码中的div，但是Foundation文档将其作为按钮元素（检查此页面上的第一个下拉按钮以查看它是否正常工作：http://foundation.zurb.com/docs/components/dropdown_buttons.html）：

<application
    android:name="com.foobar.app.BaseCodeApplication"
>

我估计如果您调整按钮以匹配上述按钮，那么它将起作用。 Foundation的javascript需要aria角色和类以及按钮元素。

基础下拉按钮没有正确样式

1 个答案: