我是 HTML 和 CSS 的新手。我想从菜单栏的左侧添加文本/图像。怎么做？找到了许多其他方法，但与我得到的代码不匹配。 这是我使用的代码
<html>
<title>TEST</title>
<link rel="icon" type="image/png" href="logo1.png"/>
<h1 ><font color="white">TEST</font></h1>
<head>
<style>
ul {
list-style-type: none;
width:75%;
margin: 0 auto;
padding: 0;
overflow: hidden;
background-color: #339cff;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: #345cff;
}
.active {
background-color: #ff9333;
}
</style>
</head>
<body>
<ul>
<li><a class="active" href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#contact">ontact</a></li>
</ul>
</body>
<body background="background.jpg">
<br>
<h5 style="position: fixed; bottom: 0; width:100%;text-align: center"><font color="yellow"><strong> Copyright © TEST 2016 All Rights Reserved.</strong></font></h5>
<img src="banner.jpg" style="width:100%;">
</body>
</html>
最佳答案
p {
display: inline-block;
float: left;
}
ul {
list-style-type: none;
width:75%;
margin: 0 auto;
padding: 0;
overflow: hidden;
background-color: #339cff;
display: inline-block;
float: left;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: #345cff;
}
.active {
background-color: #ff9333;
}<p>Hello World!</p>
<ul>
<li><a class="active" href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#contact">ontact</a></li>
</ul>
</body>
<body background="background.jpg">
<br>
<h5 style="position: fixed; bottom: 0; width:100%;text-align: center"><font color="yellow"><strong> Copyright © TEST 2016 All Rights Reserved.</strong></font></h5>
<img src="banner.jpg" style="width:100%;">关于html - 如何在 HTML 中的菜单栏左侧添加文本，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39620020/