我的问题是我的标题没有覆盖导航栏。 我正在使用物化。
<div class="header">
<img src="img/header.png" />
</div>
<!-- Navbar -->
<nav>
<div class="nav-wrapper teal darken-3">
<a href="#!" class="brand-logo"><img src="img/brandlogo" alt="NobleStudios" /></a>
<a href="#" data-target="mobile-demo" class="sidenav-trigger"><i class="material-icons">menu</i></a>
<ul class="right hide-on-med-and-down">
<li><a href="about.php">About</a></li>
<li><a href="members.php">Members</a></li>
<li><a href="contact.php">Contact</a></li>
<li><a href="news.php">News</a></li>
</ul>
</div>
</nav>
<ul class="sidenav" id="mobile-demo">
<li><a href="about.php">About</a></li>
<li><a href="members.php">Members</a></li>
<li><a href="contact.php">Contact</a></li>
<li><a href="news.php">News</a></li>
</ul>
最佳答案
在 .header class 中定义的属性像这样。
.header {
padding: 20px;
background: black;
color: white;
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/css/materialize.min.css">
<body>
<div class="header">
<img src="img/header.png"></img>
<span>Header Content</span>
</div>
<!-- Navbar -->
<nav>
<div class="nav-wrapper teal darken-3">
<a href="#!" class="brand-logo"><img src="img/brandlogo" alt="NobleStudios"></img></a>
<a href="#" data-target="mobile-demo" class="sidenav-trigger"><i class="material-icons">menu</i></a>
<ul class="right hide-on-med-and-down">
<li><a href="about.php">About</a></li>
<li><a href="members.php">Members</a></li>
<li><a href="contact.php">Contact</a></li>
<li><a href="news.php">News</a></li>
</ul>
</div>
</nav>
<ul class="sidenav" id="mobile-demo">
<li><a href="about.php">About</a></li>
<li><a href="members.php">Members</a></li>
<li><a href="contact.php">Contact</a></li>
<li><a href="news.php">News</a></li>
</ul>
</body>
关于html - 我的标题我没有覆盖，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50236375/