摆脱<ul> </ul>的要点

时间:2011-11-27 23:02:08

标签: html html-lists

我有以下列表:

 <ul id="otis">
 <li>Benz</li>
 <li>Other Benz</li>
 <li>Other Other Benz</li>
 </ul>

我想摆脱子弹,所以我尝试了:

 ul#otis {
 list-style-type: none;
 }

虽然没有用。从显示的列表中删除项目符号的正确方法是什么?

14 个答案:

答案 0 :(得分:179)

假设不起作用,您可能希望将基于id的选择器与li结合使用,以便将css应用于li元素:

#otis li {
    list-style-type: none;
}

参考:

答案 1 :(得分:26)

我自己也有同样极端恼人的问题,因为剧本没有注意到我的样式表。 所以我写道:

<ul style="list-style-type: none;">

那不起作用。所以,另外,我写道:

<li style="list-style-type: none;">

瞧!它有效!

答案 2 :(得分:17)

以下代码

#menu li{
  list-style-type: none;
}
<ul id="menu">
        <li>Root node 1</li>
        <li>Root node 2</li>
    </ul>

将产生此输出:

output is

答案 3 :(得分:17)

要从无序列表中删除项目符号,您可以使用:

2

您也可以使用:

list-style: none;

要么有效,要么第一种是获得相同结果的较短方式。

答案 4 :(得分:15)

尝试使用此功能,在Chrome / Safari上进行测试

ul {
 list-style: none;
}

答案 5 :(得分:4)

<style type="text/css">
 ul#otis {
     list-style-type: none;
   }
</style>
紧接在列表之前的

进行测试。或

<ul style="list-style-type: none;">

答案 6 :(得分:3)

必须有别的东西。

由于:

   ul#otis {
     list-style-type: none;
   }

应该正常工作。

也许有一些CSS规则会覆盖它。

使用您的DOM检查器查找。

答案 7 :(得分:3)

我遇到了同样的问题,我最终修复它的方式是这样的:

ul, li{
    list-style:none;
    list-style-type:none;
}

也许这有点极端,但是当我这样做时,它对我有用。

<小时/> 希望这有助于

答案 8 :(得分:3)

为内联样式表尝试此代码

<ul style="list-style-type: none;">
    <li>Try This</li>
    </ul>

答案 9 :(得分:3)

要从 UL 中移除子弹,您只需使用 list-style: none; list-style-type: none; 如果仍然不起作用然后我想有一个优先级 CSS 的问题。可能已全球UL已定义。因此,最好的方法是为特定的UL添加一个类/ ID,并在那里添加 CSS 。希望它会奏效。

答案 10 :(得分:2)

这很好用 HTML

<ul id="top-list">
        <li><a href="#">Home</a></li>
        <li><a href="#">Process</a></li>
        <li><a href="#">Work</a></li>
        <li><a href="#">Team</a></li>
        <li><a href="#">Contact</a></li>
      </ul>

CSS

#top-list{
  list-style-type: none;
  list-style: none;}

答案 11 :(得分:1)

您的代码:

ul#otis {
    list-style-type: none;
}

我的建议:

#otis {
    list-style-type: none;

}

在css中,您只需使用#id而不是element#id。这里提供了更多有用的提示: w3schools

答案 12 :(得分:1)

在Chrome中,您可以使用

ul {
 list-style: none;
}

答案 13 :(得分:0)

我遇到了同样的问题。

解决方案是通过背景图片添加了子弹,而不是通过list-style-type添加。快速'背景:无',鲍勃是你的叔叔!