html - 无法删除 CSS 导航栏中的元素符号点

Question

我有一个使用 CSS 设置样式的导航栏。我似乎无法使用 list-style-type: none 删除要点。或者用 !important; 覆盖它功能。这就是我的 html 和 css 的样子。这在 chrome 中工作正常，但错误出现在 firefox 和 IE 中。

<div class="menu">
<ul>
<li><a href="index1.html">Home</a></li>
<li><a href="aboutus.html">About</a></li>
<li class="dropdown">
<a href="read.html">Read</a>
<ul class="drop-content">
<li><a href="#">Latest Issue</a></li>
<li><a href="#">Prose</a></li>
<li><a href="#">Poetry</a></li>
<li><a href="#">Transalations</a></li>
</ul>
</li>
<li class="dropdown">
<a href="research.html">Research</a>
<ul class="drop-content">
<li><a href="#">Publications</a></li>
<li><a href="#">Deaprtments</a></li>
<li><a href="#">Apply</a></li>
</ul>
</li>
<li><a href="newsandevents.html">News and Events</a></li>
</ul>
</div>

CSS

   .menu {list-style-type: none;
   height: 50px;
   display: block;
   font-family: Helvetica;}

   li {float: left;
   }




   a {display: block;
   text-align: center;
   text-decoration: none;
   color: #000000;
   padding: 15px 15px 15px 15px;   
   overflow: hidden;
   background-color:#009899;}

Answer 1

您在 .menu 中有 list-style-type class 标签是一个 div(list-style-type 是 <li> 标签的样式，不是 div)

改变

 li {float: left;
   }

到

 li {float: left;
   list-style-type:none;
   }

   .menu {
   height: 50px;
   display: block;
   font-family: Helvetica;}

   li {float: left;
   list-style-type:none;
   }
   a {display: block;
   text-align: center;
   text-decoration: none;
   color: #000000;
   padding: 15px 15px 15px 15px;   
   overflow: hidden;
   background-color:#009899;}

<div class="menu">
<ul>
<li><a href="index1.html">Home</a></li>
<li><a href="aboutus.html">About</a></li>
<li class="dropdown">
<a href="read.html">Read</a>
<ul class="drop-content">
<li><a href="#">Latest Issue</a></li>
<li><a href="#">Prose</a></li>
<li><a href="#">Poetry</a></li>
<li><a href="#">Transalations</a></li>
</ul>
</li>
<li class="dropdown">
<a href="research.html">Research</a>
<ul class="drop-content">
<li><a href="#">Publications</a></li>
<li><a href="#">Deaprtments</a></li>
<li><a href="#">Apply</a></li>
</ul>
</li>
<li><a href="newsandevents.html">News and Events</a></li>
</ul>
</div>