我在我的Rails应用程序中使用Materialize作为UI框架，除了'material-icons' 'menu'选项无法正常工作外，一切都正常。
完整的代码如下所示，但是以下部分不适当：
<a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons">menu</i></a>
当我缩小浏览器以触发响应性时，它没有变成汉堡图标，而是只显示文本节点“menu”。我无法弄清楚我的问题出在哪里。其他所有功能都正常。
这是整个导航/下拉菜单的结构：
<!-- Dropdown Structure -->
<ul id="dropdown1" class="dropdown-content">
<li><a href="#!">My Profile</a></li>
<li><a href="#!">My Courses</a></li>
<li class="divider"></li>
<li><a href="#!">Logout</a></li>
</ul>
<!-- Dropdown Structure -->
<ul id="dropdown2" class="dropdown-content">
<li><a href="#!">My Profile</a></li>
<li><a href="#!">My Courses</a></li>
<li class="divider"></li>
<li><a href="#!">Logout</a></li>
</ul>
<header>
<nav class="z-depth-2">
<div class="container">
<div class="nav-wrapper">
<a href="#!" class="brand-logo">OppSim</a>
<a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons">menu</i></a>
<ul class="right hide-on-med-and-down">
<!-- web view -->
<li><a href="#">Courses</a></li>
<li><a href="#">Signup</a></li>
<li><a href="#">Login</a></li>
<!-- Dropdown Trigger -->
<li><a class="dropdown-button" href="#!" data-activates="dropdown1">JTB<i class="material-icons right"></i></a></li>
</ul>
<ul class="side-nav" id="mobile-demo">
<!-- mobile view -->
<li><a href="#">Courses</a></li>
<li><a href="#">Signup</a></li>
<li><a href="#">Login</a></li>
<!-- Dropdown Trigger -->
<li><a class="dropdown-button" href="#!" data-activates="dropdown2">JTB<i class="material-icons right"></i></a></li>
</ul>
</div>
</div>
</nav>
</header>
或者我应该继续打高尔夫球。