语法荧光笔的可访问HTML结构

问题描述

我正在修复一个旧的WordPress语法荧光笔插件（该插件的所有者放弃了它），并且在修复PHP错误时很容易，而在修复它的同时，我也可能会改善可访问性。

我的问题是关于代码的HTML结构。我想在一侧显示数字，并在其旁边显示代码：

我认为HTML可能是这样的：

<section> <!-- Maybe article? -->
    <header>
        <h1>Sample HTML</h1> <!-- Maybe <h3> would fit my blog posts best -->
        <div role="toolbar">toolabar buttons here</div>
    </header>
    <ol>
        <li><span class="sh-r ">&lt;div </span><span class="sh-e ">class</span>=<span class="sh-s ">"grid"</span><span class="sh-r ">&gt;</span>
        ...
    </ol>
</section>

但是我不确定。代码应该放在<ol>还是<table>中？更改颜色的范围可以吗？工具栏角色合适吗？我想念什么吗？如果有人有可访问的代码突出显示示例，我很乐意看到它。

现在的样子，它是一个表，其中所有数字都在一个<td>中，而所有代码都在另一个中！

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

accessibility html