我在定位自定义图像徽标时遇到问题，我希望它在导航栏中完美居中，但在移动视图和桌面视图中有点偏离。手机查看
我尝试使用的桌面版本也有点偏离，vertical-align: middle;但它没有正常工作。
例子：
.logo {
display: inline-block;
height: 100%;
}
.logo>img {
vertical-align: middle;
position: relative;
top:1px;
} <!-- Compiled and minified CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/css/materialize.min.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/js/materialize.min.js"></script>
<div class="navbar-fixed">
<nav class="blue darken-1">
<div class="container">
<div class="nav-wrapper">
<a href="#Main" class="logo">
<img src="https://i.imgur.com/sFliVuL.png" >
</a> <a class="sidenav-trigger" data-target="mobile-demo" href="#"><i class="material-icons">menu</i></a>
<ul class="right hide-on-med-and-down">
<li>
<a class="waves-effect" href="#home">Home</a>
</li>
<li>
<a class="waves-effect" href="#info">Info</a>
</li>
<li>
<a class="waves-effect" href="#portfolio">Portfolio</a> …在 Materialise 中取消选中时，如何让复选框显示为“不确定”？
HTML：
<input type="checkbox" id="test" checked/>
<label for="test" id="test-label">Red</label>
JS：
$('#test-label').click(function() {
var checkbox = $(this).prev();
if (!$(checkbox).is(':checked'))
$(checkbox).prop('indeterminate', true);
});
我在正在处理的网站上使用了大量图标。我设置的文件很好，我似乎找不到问题。我还是个新手。