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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/22599801/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 01:20:35  来源:igfitidea点击:

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

htmlcssvalidationhtml-lists

提问by user3453751

I am trying to find a solution to this validation error. I have an image grid with thumbnails that bring up a modal when clicked. Everything works correctly but it does not validate. I can't put li around the modal image or it shows before clicked. I am pretty new to coding, any help would be great.

我正在尝试找到解决此验证错误的方法。我有一个带有缩略图的图像网格,单击时会显示一个模式。一切正常,但无法验证。我不能在模态图像周围放置 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">

code:

代码:

<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>

回答by Jukka K. Korpela

The content model of uldoes not allow an achild, in any version of HTML. You need to wrap the aelement inside an lielement, if you wish to have it inside a ulelement.

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

It is not clear why you are using ulin the first place. If the second image is not visible initially, that surely depends entirely on style sheets and scripts involved. As they have not been disclosed, it is impossible to say how you should rewrite the code.

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

回答by Bipon Biswas

You must wrap every inner ULs with an LI.

您必须用 LI 包裹每个内部 UL。

The children (direct descendants) of a ul element must all be li elements. This is a purely syntactic requirement.

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

You can see then hope fully clear. correct semantics for ul in ul

你可以看到然后希望完全清楚。 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> <----