屏幕阅读器不读取有序列表的项目符号和CSS
我一直在将Word文档的作业帮助转换为HTML，而我正在使用的屏幕阅读器出现一些问题（Jaws 16）。 我用CSS设置的有序列表显示为“第1步”，“第2步”。 然而，屏幕阅读器不能识别这一点，也不会读取列表中的“步骤1”部分。
有没有办法做到这一点，或者我正在看一些更加手动的东西，让屏幕阅读器能够正确地调用什么？
ol{list-style-type: none; counter-reset: elementcounter; padding-left: 0;}
li:before{content: "Step " counter(elementcounter) ". "; counter-increment:elementcounter; font-weight: bold;6px}
<ol>
<li>Open fridge</li>
<li>locate beer</li>
</ol>
我尝试了JAWS 18（最新版本）和JAWS 16.两者都在Firefox和Chrome中工作，但都不在Internet Explorer中。
（ 注意：你原来的例子有'6px'，只是浮在你的样式表中，我猜这是一个font-size属性，但我只是在我的例子中把它留了下来。）
<style>
ol
{
list-style-type: none;
counter-reset: elementcounter;
padding-left: 0;
}
li:before
{
content: "Step " counter(elementcounter) ". ";
counter-increment:elementcounter;
font-weight: bold;
}
</style>
<button>foo</button>
<ol>
<li>Open fridge</li>
<li>locate beverage</li>
</ol>
<button>bar</button>
我在列表前后放置了按钮，所以我会在我的测试中使用制表符。 由于您的列表不是可放大的，因此我只是首先选中了FOO按钮，然后使用虚拟PC光标向下箭头查看下一个元素。 这是我在FF和Chrome上听到的JAWS的内容：
上一篇: Screen Reader not reading bullets and CSS for ordered lists