Question

我正在尝试使用HTML：

创建2个有序列表
在每个O.L.嵌套无序列表并在

然而，我的编号并没有按照应有的方式工作，我得到了， 1。 1。而不是 1。 2.等。

我的代码：

＆＃13;

<ol>
  <li>Fruits</li>
  <ul>
    <li>Apples</li>
    <li>Oranges</li>
    <li>Plum</li>
    <li>Watermelon</li>
  </ul>
</ol> 
<ol>
  <li>Vegetables</li>
  <ul>
    <li>Carrots</li>
    <li>Lettuce</li>
    <li>Cucumber</li>
    <li>Tomato</li>
  </ul>
</ol>

＆＃13;

Answer 1

听起来你真的想要1个有序列表，而不是2.如果你希望第一个拥有数字1而第二个拥有数字2，那就是一个列表。如果您开始新列表，这些数字将会重置。

＆＃13;

<ol>
  <li>Fruits
    <ul>
      <li>Apples</li>
      <li>Oranges</li>
      <li>Plum</li>
      <li>Watermelon</li>
    </ul>
  </li>
  <li>Vegetables
    <ul>
      <li>Carrots</li>
      <li>Lettuce</li>
      <li>Cucumber</li>
      <li>Tomato</li>
    </ul>
  </li>
</ol>

＆＃13;

Answer 2

不确定为什么每个人都在回答文档，正式地说，你不能将<ul>元素作为直接子元素嵌套到<ol>元素，反之亦然，所以我已经修改了相应的标记。

Demo

<ol>
    <li>
        <h2>Fruits</h2>
        <ul>
            <li>Apples</li>
            <li>Oranges</li>
        </ul>
    </li>
    <li>
        <h2>Vegetables</h2>
        <ul>
            <li>Carrot</li>
        </ul>
    </li>
</ol>

在这里，您可以根据需要调整无序列表的padding和margin，但我只是概括了它应该如何。

您也可以在<p>的地方使用<h2>或任何其他标记，但我认为<h2>或<h3>应该适合您的情况。

Answer 3

也许您没有使用list-style - 属性，而是使用counter-increment - 属性，因此您的HTML保持不变。

＆＃13;

ol {
  counter-increment: section;
}
ol > li {
  list-style-type: none;
}
ol > li:before {
  content: counter(section)". ";
}

＆＃13;

<ol>
  <li>Fruits</li>
  <ul>
    <li>Apples</li>
    <li>Oranges</li>
    <li>Plum</li>
    <li>Watermelon</li>
  </ul>
</ol>
<ol>
  <li>Vegetables</li>
  <ul>
    <li>Carrots</li>
    <li>Lettuce</li>
    <li>Cucumber</li>
    <li>Tomato</li>
  </ul>
</ol>

＆＃13;

Answer 4

您在第一行之后结束了有序列表。不要将标记放在整个有序列表的末尾。示例如下。

<ol>
  <li>Fruits</li>
  <ul>
    <li>Apples</li>
    <li>Oranges</li>
    <li>Plum</li>
    <li>Watermelon</li>
  </ul>
  <li>Vegetables</li>
  <ul>
    <li>Carrots</li>
    <li>Lettuce</li>
    <li>Cucumber</li>
    <li>Tomato</li>
  </ul>
</ol>

HTML - 有序列表没有正确编号

4 个答案: