Question

我正在为类进行HTML分配，但在尝试验证我的网页时不断收到以下错误：“元素ol不允许作为此上下文元素的子元素。”有关如何解决此问题的任何建议？ HTML部分发布在下面：

<pre class="proterozoic"  style="background-color: #FF99CC">
<ol class="era">
    <li>Proterozoic</li>
</ol>
</pre>
<pre class="paleozoic" style="background-color: #0099FF">
<ol class="era">
    <li>Paleozoic</li>
        <ol class="period">
        <li>Cambrian</li>
            <li>Ordovician</li>
            <li>Silurian</li>
            <li>Devonian</li>
            <li>Mississippian</li>
            <li>Pennsylvanian</li>
            <li>Permian</li>
        </ol>
</ol>
</pre>
<pre class="mesozoic" style="background-color: #66CC66">
<ol class="era">
    <li>Mesozoic</li>
        <ol class="period">
            <li>Triassic</li>
            <li>Jurassic</li>
            <li>Cretaceous</li>
        </ol>
</ol>
</pre>
<pre class="cenozoic" style="background-color: #FF3333">
<ol class="era">
    <li>Cenozoic</li>
        <ol class="period">
        <li>Paleogene</li>
                <ol class="epoch">
            <li>Paleocene</li>
                    <li>Eocene</li>
                    <li>Oligocene</li>
                </ol>
        <li>Neogene</li>
                <ol class="epoch">
                <li>Miocene</li>
                    <li>Pliocene</li>
                    <li>Pleistocene</li>
                    <li>Holocene</li>
                </ol>
        </ol>
</ol>
</pre>

Answer 1

<pre>元素用于预先格式化的文本，因此您无法在其中添加其他格式标记。

从外观上看，最好使用<div>元素。如果您希望所有内容都显示在typewriter font中，则可以将div { font-family:monospace; }添加到CSS模板中。

可以通过将嵌套的<ol>元素保留在父<li>元素内来修复列表的嵌套，如下所示：

<ol class="era">
    <li>Paleozoic
        <ol class="period">
            <li>Cambrian</li>
            <li>Ordovician</li>
            <li>Silurian</li>
            <li>Devonian</li>
            <li>Mississippian</li>
            <li>Pennsylvanian</li>
            <li>Permian</li>
        </ol>
    </li>
</ol>

“在这种情况下，元素不允许作为元素之子。”

1 个答案: