MaterializeCSS 图标不起作用
Ter*_*ryN 2 html css materialize
我在使用 MaterializeCSS 时遇到了显示图标的问题。我正在使用文档中的“入门”，但无论出于何种原因，图标都拒绝显示。下面是我正在使用的代码
<!DOCTYPE html>
<html>
<head>
<!--Import Google Icon Font-->
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--Import materialize.css-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/css/materialize.min.css">
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<nav>
<ul class="hide-on-med-and-down">
<li><a href="#!">First Sidebar Link</a></li>
<li><a href="#!">Second Sidebar Link</a></li>
</ul>
<ul id="slide-out" class="side-nav fixed">
<li class="bold"><a href="#!" class="waves-effect waves-teal">First Sidebar Link</a></li>
<li class="bold"><a href="#!" class="">Second Sidebar Link</a></li>
<li class="no-padding">
<ul class="collapsible collapsible-accordion">
<li>
<a class="collapsible-header waves-effect waves-teal">Dropdown<i class="mdi-navigation-arrow-drop-down"></i></a>
<div class="collapsible-body">
<ul>
<li><a href="#!">First</a></li>
<li><a href="#!">Second</a></li>
<li><a href="#!">Third</a></li>
<li><a href="#!">Fourth</a></li>
</ul>
</div>
</li>
</ul>
</li>
</ul>
<a href="#" data-activates="slide-out" class="button-collapse"><i class="mdi-navigation-menu"></i></a>
</nav>
<!--Import jQuery before materialize.js-->
<script src="https://code.jquery.com/jquery-3.0.0.min.js" integrity="sha256-JmvOoLtYsmqlsWxa7mDSLMwa6dZ9rrIdtrrVYRnDRH0=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/js/materialize.min.js"></script>
<script>
$('.button-collapse').sideNav({
menuWidth: 300, // Default is 240
closeOnClick: true // Closes side-nav on <a> clicks, useful for Angular/Meteor
});
$('.collapsible').collapsible();
</script>
</body>
</html>
所有这些代码试图做的是显示一个导航栏，它是直接从文档中拉出来的。
调整浏览器大小时不显示汉堡菜单
下拉箭头不会出现在下拉菜单项旁边。
我觉得我错过了一些愚蠢的东西，但我已经看了 2 个小时，我的大脑已经融化了。任何帮助，将不胜感激。
编辑：这里也是下拉箭头的更新代码：
<i class="material-icons right">arrow_drop_down</i>
我也遇到了这个问题，想知道我的汉堡包图标去哪儿了！
不幸的是，他们的很多文档都没有更新，所以你使用的代码有点过时了。
改变这个：
<i class="mdi-navigation-menu"></i>
对此：
<i class="material-icons">menu</i>
您应该会看到该图标。如果您检查他们的源代码，您会发现即使他们的站点使用的更新代码与他们的文档不同：
| 归档时间： |
|
| 查看次数： |
3714 次 |
| 最近记录： |