html - 如何使垂直菜单水平删除元素符号下划线并使用 css 更改字体？

Question

如何使用 CSS 使我的垂直菜单水平、更改字体和下划线以及删除元素符号？

<div class="nav-menu"> </div>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="menu.html">Our menu</a></li>
<li><a href="Location.html">Our Locations</a>
<li><a href="contact.html">Contact Us</a>   
</ul>


.nav-menu {float:left;
          list-style-type: none;
          font-family: "heiti sc"
}

Answer 1

你的<ul>不包含在您的 <nav class="nav-menu"> 中.先把它放进去。然后你可以定位 <ul>和 <li>内的元素:

.nav-menu li {
  list-style: none;   <------ this removes the bullets
  display: inline;    <------ this makes it horizontal, can also use inline-block
  font-family: "heiti sc"
}

.nav-menu li a,
.nav-menu li a:hover,
.nav-menu li a:active,
.nav-menu li a:visited {
  text-decoration: none;   <--- removes underline
}