我这样做的时候……
<li>
<a href="#">
<img src="#" width="#" height="#" alt="#" />
<ol class="#">
<li>#</li>
<li>#</li>
<li>#</li>
</ol>
</a>
</li>
它像Firefox一样在Firefox中渲染…
<li>
<a href="#">
<img src="#" width="#" height="#" alt="#" />
</a>
<ol class="#">
<a href="#"></a>
<li>a href="#">#</a></li>
<a href="#"></a>
<li>a href="#">#</a></li>
<a href="#"></a>
<li>a href="#">#</a></li>
</ol>
<a href="#"></a>
</li>
似乎在Webkit中正确呈现.有任何想法吗？
解决方法
虽然HTML5现在允许< a>在包含块级元素(例如ol)的元素中,Firefox的解析器传统上不接受,而是将它们转换为单独的< a>序列.在块级元素内部,它们只包含内联级别元素,这就是您所看到的.
因为Firefox是唯一一个主要的浏览器制作者,Mozilla人接受了HTML5的更改,同意改变他们的解析器以允许< a>包装块内容的元素. (这只是HTML5的许多解析器更改之一,尽管它似乎可能是最重要的一个)
这种变化发生在Firefox 4中,所以你不会在那里看到问题,但Firefox 3.x仍然使用旧的行为.
解决方法,包括使用< div>使用onclick属性而不是< a>,并使用JavaScript将块包装在< a>中元素,但没有非JS解决方案.鉴于(a)页面应该仍然可用,并且(b)Firefox 3.x应该在不太遥远的未来消亡,一个合理的选择就是接受现在的奇怪的Firefox 3行为.
