如何在无序列表项中编码嵌套有序列表? [英] How to code a nested ordered list within an unordered list item?

问题描述

我想在单个无序列表项中嵌套一个有序列表，以便有序列表拆分列表项的文本.例如:

I want to nest an ordered list within a single unordered list item, such that the ordered list splits up the text of the list item. For example:

•一个无序点，文字文字文字...
1.第一个有序列表项
2.第二个有序列表项
...来自同一个无序点的连续文本.
•另一个无序点

• An unordered point, text text text...
1. First ordered list item
2. Second ordered list item
...continued text from same unordered point.
• Another unordered point

我想知道编写此代码的正确方法是什么?我试过了:

I'm wondering what's the proper way to code this? I've tried:

<ul>
  <li>An unordered point, text text text...
  <ol>
    <li>First ordered list item</li>
    <li>Second ordered list item</li>
  </ol>
  ...continued text from same unordered point.</li>
  <li>Another unordered point</li>
</ul>

但不确定这是否是标记它的正确方法.此外，当我在 Chrome 和 FF 中对此进行测试时，嵌套有序列表前后的行距不平衡；我得到:

but not sure if that's the correct way to mark it up. Also, when I testing this in Chrome and FF, the line spacing before and after the nested ordered list does not balance out; I'm getting:

•一个无序点，文字文字文字...
1.第一个有序列表项
2.第二个有序列表项

...来自同一个无序点的连续文本.
•另一个无序点

• An unordered point, text text text...
1. First ordered list item
2. Second ordered list item

...continued text from same unordered point.
• Another unordered point

推荐答案

这是正确的方法，但是您需要使用 css 来删除嵌套列表上的边距，这将解决您的间距问题.

This is the correct way, however you will need to play with the css to remove the margins on your nested list, which will fix your spacing problem.

这篇关于如何在无序列表项中编码嵌套有序列表?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！