w3 html5 验证，锚点不允许作为 ul 的子项

Question

当我在 w3 验证器上验证我的 html 时，出现以下错误：

Element a not allowed as child of element ul in this context. (Suppressing further errors from this subtree.).

该站点在我的 phone、平板电脑和台式机上正常显示（并且锚点正常工作），但我不太理解此错误消息。有人可以告诉我我做错了什么以及如何正确地做到这一点吗？

这是产生错误的代码部分：

<section id="skills">
    <div class="skills-header">
        <p>Pozdravljen Svet! Pišem lahko:</p>
    </div>
    <div class="skills-container">
        <ul>
            <li>< html5 ></li>
            <li> { css3 }</li>
            <li>javascript.js</li>
            <li class="break">$(jQuery)</li>
            <li class="break"><%= rails 4 %></li>
            <li class="break">< div class="bootstrap" ></li>
            <li class="break">$ sudo apt-get update</li>
            <a href="https://si.linkedin.com/pub/miha-šušteršič/b2/60/654"><li class="profile-icon ion-social-linkedin"></li></a>
            <a href="https://github.com/Shooshte"><li class="profile-icon ion-social-github"></li></a>
        </ul>
    </div>
</section>

Answer 1

<ul> 只能包含 <li> 个元素。就这么简单。

<ul> 是一个 "Unordered List"，<li> 是一个 "List Item"。列表应该只包含列表项...

您可能会发现它在您的浏览器中正常工作，但您不应该保持这种状态。一些浏览器会自动更正您的错误并在您的 <a> 元素周围包装一个 <li>，其他浏览器只会让它看起来很糟糕。

如果您想更正您的代码，我建议如下：

<li><a href="https://si.linkedin.com/pub/miha-šušteršič/b2/60/654" class="profile-icon ion-social-linkedin"></a></li>
<li><a href="https://github.com/Shooshte" class="profile-icon ion-social-github"></a></li>

w3 html5 验证，锚点不允许作为 ul 的子项

w3 html5 validation, anchor not allowed as child of ul

html

w3c-validation