验证错误:元素a在此上下文中不允许作为元素ul的子元素.(抑制此子树中的更多错误.)

Question

我试图找到这个验证错误的解决方案.我有一个带缩略图的图像网格,点击时会显示一个模态.一切正常但它没有验证.我不能把li放在模态图像周围,或者在点击之前显示.我对编码很新,任何帮助都会很棒.

Line 54, Column 41: Element a not allowed as child of element ul in this context. 
(Suppressing further errors from this subtree.)

<a href="#_" class="lightbox" id="img10">

码:

<ul class="cbp-rfgrid">
    <li>
        <a href="#img10"><img src="images/portfolio/goat-tn2.jpg" alt="logo"></a>
    </li>
    <a href="#_" class="lightbox" id="img10">
      <img src="images/portfolio/goat.jpg" alt="logo">
    </a>
</ul>

Answer 1

在任何版本的HTML中,内容模型ul都不允许a孩子.如果希望将a元素放在li元素中,则需要将元素包装在ul元素中.

目前尚不清楚为什么要使用它ul.如果最初看不到第二个图像,那肯定完全取决于所涉及的样式表和脚本.由于它们尚未公开,因此无法说明如何重写代码.

Answer 2

您必须使用LI包装每个内部UL.

ul元素的子元素(直接后代)必须都是li元素.这纯粹是语法要求.

你可以看到希望完全清楚. ul中ul的正确语义

<ul class="menu">
<li>
    <a href="">Demo1</a>
</li>
<li> <----
    <ul class="inside">
        <li><a href="#">Lorem ipsum</a></li>
        <li><a href="#">Lorem</a></li>
    </ul>
</li> <----