时间戳

首页 > 解决方案 > WCAG 2.0 验证错误：在此上下文中，元素 span= 不允许作为元素 a 的子级。（抑制来自该子树的更多错误。）

html - WCAG 2.0 验证错误：在此上下文中，元素 span= 不允许作为元素 a 的子级。（抑制来自该子树的更多错误。）

问题描述

再次向社区问好！我正在尝试验证一个 Wordpress 网站，但我遇到了以下 4 个很可能相关的错误：

第 182 行，第 26 列：在属性名称中引用“。可能的原因：之前某处缺少匹配的引用。

第 182 行，第 27 列：元素 span="la 在此上下文中不允许作为元素 a 的子元素。（抑制此子树中的更多错误。）元素 a 的内容模型：透明，但不得有交互式内容或元素后代.

第 182 行，第 34 列：杂散结束标签跨度。

第 183 行，第 4 列：结束标记 a 违反嵌套规则。

有问题的代码如下：

    <footer id="colophon" class="site-footer" role="contentinfo">
        <div class="footer-widget-area">
        <div class="wrapper">
            <div class="flex-grid">
                            <div class="col">
                    <div id="custom_html-5" class="widget_text widget widget_custom_html"><div class="textwidget custom-html-widget"><script data-account="iFDG9kXlfW" src="https://cdn.userway.org/widget.js"></script></div></div>                </div>
                                                </div>
        </div>
    </div>
    <div class="site-info">
    <div class="wrapper">
                    copyright all rights reserved            <span class="sep"> | </span>
                Theme: Minimal Blog by <a href="http://wpinterface.com/" rel="designer">WPinterface</a>.    </div>
</div><!-- .site-info -->


<a id="scroll-top">
    <span="la la-arrow-up"></span>
</a></footer>

您也可以查看该网站，虽然它只有希腊语，但这里是链接： https ://tsimiklidentist-petalidi.gr/

提前感谢大家的时间，任何帮助将不胜感激！

标签： htmlwordpresswcagwcag2.0

解决方案

两件事情

  1. <a>必须有一个href有效的（不是你的错误的一部分，只是一个最佳实践）。将其保留为锚 ( <a>) 并href="current page URL"在生成的 HTML 中设置 ，这样如果 JavaScript 失败，它将简单地重新加载页面，产生相同的效果。

  2. <span="la la-arrow-up"></span>- 你错过了class=""你不能有一个等于东西的跨度。相反，它应该是<span class="la la-arrow-up"></span>.

将滚动到顶部箭头更改为：-

    <button id="scroll-top">
        <span class="la la-arrow-up"></span>
    </button>

推荐阅读