Internet explorer <；ol>；在IE中显示1,1,1,1而不是1,2,3,4（已尝试列表项）

我有一个有序列表，其中任何版本的Internet Explorer都是1,1,1,1，而不是1,2,3,4。阅读此内容后，会出现这种情况，因为li上设置了宽度，您需要添加“显示：列表项；”为了让它发挥作用，我尝试过，但没有结果，我也尝试过用同样的问题去除宽度

这是我的名单：

<div id="nav">
<ul>
    <li><a href="/">Home</a></li>
    <li>
        <a href="#">New Products</a>
        <ol class="newProducts">
            <li><a href="#"><span>Link 1</span></a></li>
            <li><a href="#"><span>Link 2</span></a></li>
            <li><a href="#"><span>Link 3</span></a></li>
            <li><a href="#"><span>Link 4</span></a></li>
            <li><a href="#"><span>Link 5</span></a></li>
            <li><a href="#"><span>Link 6</span></a></li>
            <li><a href="#"><span>Link 7</span></a></li>
            <li><a href="#"><span>Link 8</span></a></li>
        </ol>
    </li>
    <li><a href="news.html">News</a></li>
    <li><a href="payment-and-shipping.html">Payment &amp; Shipping</a></li>
</ul></div>

<pre>
#nav ul, #nav ol {
position: absolute;
top: 158px;
    left: 0px;
    list-style: none;
    text-transform: uppercase;
}

#nav ul > li {
    float: left;
    padding: 10px;
    border-right: 2px solid #000000;
    font-size: 16px;
    position: relative;
}    

#nav ul > li:hover {
    background: url(../images/headerHover.png) bottom no-repeat;
    padding-bottom: 10px;
}    

#nav ul > li a {
    color: #FFFFFF; 
}

#nav ul > li > ol {
    display: none;
}

#nav ul > li:hover ol {
    margin-top: -120px;
    left: 0px;
    display: block;
    padding-top: 7px;
    list-style: decimal outside;
    font-size: 10px;
    color: #fdc800;
    font-family: Arial, Helvetica, sans-serif;
    display: block;
    text-transform: none;
}    

#nav ul > li:hover ol > li {
    text-align: left;
    padding: 0px 0px 5px 0px;
    width: 240px;
    border: 0px;
}    

#nav ul > li:hover ol > li:hover {
    background: none;   
}

#nav ul > li:hover ol > li a {
    color: #FFFFFF;
    text-decoration: none;
}    
</pre>

这是我的CSS：

#导航ul，#导航ol{
位置：绝对位置；
顶部：158px；
左：0px；
列表样式：无；
文本转换：大写；
}
#导航ul>li{
浮动：左；
填充：10px；
右边框：2px实心#000000；
字体大小：16px；
位置：相对位置；
}    
#导航ul>li:悬停{
背景：url（../images/headerHover.png）底部无重复；
垫底：10px；
}    
#导航ul>lia{
颜色：#FFFFFF；
}
#导航ul>li>ol{
显示：无；
}
#导航ul>li：悬停ol{
利润上限：-120px；
左：0px；
显示：块；
填充顶部：7px；
列表样式：外小数；
字体大小：10px；
颜色：#fdc800；
字体系列：Arial、Helvetica、无衬线字体；
显示：块；
文本转换：无；
}    
#导航ul>li：悬停ol>li{
文本对齐：左对齐；
填充：0px 0px 5px 0px；
宽度：240px；
边界：0px；
}    
#导航ul>li:悬停ol>li:悬停{
背景：无；
}
#导航ul>li：悬停ol>LIA{
颜色：#FFFFFF；
文字装饰：无；
}    

以下是我对您的问题的解释：

当您使用CSS将列表更改为顶级导航时，不需要项目符号或编号的列表。您的具体问题是，当用户单击导航以展开它时，IE中的有序列表不显示数字（只有1或无）

当您的CSS在一些旧的IE浏览器（如IE5）中失败时，您确实希望列表返回到一个编号的垂直列表。目前，它在IE5中没有显示列表编号

对吗

首先，要实现这一点，您必须从CSS中删除“list style:none”，这会破坏

和

列表项。它们不再使用CSS声明作为有序或无序列表执行。这就是从所有IE浏览器的列表中删除“数字”的原因。现在，通过删除该属性，数字将与项目符号一样显示

其次，IE5和更早版本的浏览器不知道子选择器是什么（

ul>li

），因此您可以安全地使用CSS规则对IE6或更高版本的浏览器隐藏项目符号和数字，并让IE5或更早版本返回到显示其1、2、3的有序列表格式。etc数字正常。要解决此问题，请进行如下更改：

#导航ul，#导航ol{
/*隐藏这个，让你的列表重新成为列表*/
/*列表样式：无*/
}
#导航ul>li{
/*现在隐藏IE6或更高版本的数字和项目符号，这些数字和项目符号可以作为导航横幅，不需要显示列表数字或项目符号*/
列表样式类型：无；
}

哪个IE？在IE9中似乎工作得很好：嗯，第一次悬停时非常奇怪，如果我离开它，然后再悬停在它上面，它是2,2,2,2。我正在使用IE9，但在8上也一样。我仍然没有看到。也许试着换一台电脑，以确保它不是偶然的。更新：我确实在IE8中看到了这一点。似乎这是一个已知的问题：空div不起作用，我现在对jQuery很生疏，不想尝试另一个

<style>
#nav ul, #nav ol {
  /* Hide this and let your lists return to being lists again */
  /*list-style: none;*/
}

#nav ul > li {
  /* Now hide the numbers and bullets from IE6 or greater which are able to be a navigation banner and do not need to shows list numbers or bullets */
  list-style-type: none;
}
</style>