如何使用 CSS 从无序列表中删除项目符号？答案

【问题标题】：How to delete Bullets from an Unordered List using CSS?如何使用 CSS 从无序列表中删除项目符号？
【发布时间】：2010-11-21 22:50:43
【问题描述】：

我的 CSS 中有这个：

.MainMenu
{
    position: absolute;
    top:105px;
    left:15px;    
    background-color: #67E300;  
    color:White;
    border-style:double;
    border-color:White;
    list-style-type:none;
}

MasterPage 里面的这个：

<div class="MainMenu">
        <uc2:MainMenu ID="MainMenu1" runat="server" />
    </div>

最后是 UserControl MainMenu 中的这段代码：

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="MainMenu.ascx.cs" Inherits="LoCompro.UserControls.MainMenu" %>
<ul>
    <li>Inico</li>
    <li>Navegar Por Categoria</li>
    <li>Navegar Por Marca</li>
    <li>Buscar</li>
</ul>

编辑（忘了问这个问题，哈哈）：

使用该代码不会删除项目符号列表。我不想要任何项目符号，因为我想模拟一个菜单。

谢谢各位。 :D

【问题讨论】：

标签： asp.net html css master-pages

【解决方案1】：

尝试将list-style-type 放在UL 上，而不是放在包含UL 的DIV 上。

.MainMenu
{
    position: absolute;
    top:105px;
    left:15px;    
    background-color: #67E300;  
    color:White;
    border-style:double;
    border-color:White;
}


.MainMenu ul
{
    list-style-type:none;
}

【讨论】：

【解决方案2】：

不就是这样

list-style:none;

而不是

list-style-type:none;

在你的 li/ol/ul 部分

例如

ol.foo>li {
    list-style:none;
}

或

.classThatTheListElementIsAMemberOf {
    list-style:none;
}

【讨论】：

或 list-style-type，我相信它们是同义词/别名，但是是的。投票赞成。
所以你是说在我实际声明无序列表的 UserControl 中使用该样式属性，等等。有没有办法让我改用我的 CSS。我不习惯混合样式和内容。谢谢！ :·)
它们并不完全是别名。 list-style 允许您在一个规则中设置所有列表样式规则（想想字体与字体系列）。
@Joe，赞成澄清。生活和学习，谢谢 =)
@Papuccino，但 CSS 文件中的 list-style:none 为 ul，例如：ul {list-style: none; }

【解决方案3】：

您将list-style-type 应用于div，而不是div 内的ul。试试这个：

.MainMenu
{
    position: absolute;
    top:105px;
    left:15px;    
    background-color: #67E300;  
    color:White;
    border-style:double;
    border-color:White;
}

.MainMenu ul
{
    list-style-type:none;
}

这会将list-style-type 应用于定义了css 类MainMenu 的项目内的任何ul。

【讨论】：

【解决方案4】：

您只需要在您的 CSS 中添加以下内容：

.MainMenu ul { list-style-type: none; }

它将匹配 .MainMenu div 中的 ul，这是您上面发布的代码的最终结果。

【讨论】：