我试图查看导航栏下的文本，但它只是直接出现在导航栏按钮旁边。我在 css 中尝试了一些边距属性，但似乎没有任何效果。
提前致谢!
<html>
<title>title</title>
<head>
<img src="img/logo.png">
<meta charset="uft-8">
<link rel="stylesheet" href="css/style.css">
<style>
.narBAR{margin:0 auto; width:1080px;}
.navBAR ul {padding:0px;}
.navBAR ul li {float:left;}
</style>
</head>
<body>
<body background="untitled.png">
<div class="navBAR">
<ul>
<li><a href='file:///C:/Users/Amroo/Desktop/new%201.html#'><img src="img/home.png"></a></li>
<ul>
<li><a href='file:///C:/Users/Amroo/Desktop/libarary%20one.html'><img src="img/ourbooks.png"></a></li>
<li><a href='#'><img src="img/books.png"></a></li>
</ul>
<li><a href='#'><img src="img/login.png"></a></li>
<li><a href='#'><img src="img/contact.png"></a></li>
</ul>
</div>
<div class="search">
<form action="file:///C:/Users/Amroo/Desktop/new%201.html/search.php">
<input type="text" name="search" placeholder="Search......"/>
<input type="submit" value="Search"/>
</form>
</div>
<h1>text</h1>
<img src="blog/img/mars.jpeg">
<h3>text</h3>
</body>
最佳答案
您的 CSS 类有误 .narBAR :
.narBAR{margin:0 auto; width:1080px;}
你的代码也有错误。你不能有 <img>在你的<head>所以把这个 <img src="img/logo.png">在你的<body> .
并使用 css 背景代替 <body background="untitled.png"> .
例如:
body{
background-image: url(untitled.png);
}
尽管您的代码应该可以正常工作，但您可能会遇到由于图像引起的问题，因此请设置 overflow: hidden对于 .navBAR
关于css - 文本卡在导航栏旁边，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39486804/