小编Abh*_*nis的帖子

元素的srcset属性img可帮助作者调整其网站以进行高分辨率显示,以便能够使用代表同一图像的不同资源.

图片元素帮助作者基于媒体查询和/或对特定图像格式的支持来控制用户代理向用户呈现哪个图像资源.

这两者都使作者能够控制基于设备分辨率显示图像;从而使图像响应.那么它们之间的主要区别是什么？

我确实在picture元素草案中找到了一些例子,但仍然无法理解其中的差异.以下是示例:

使用srcset属性:

<img src="pic1x.jpg" srcset="pic2x.jpg 2x, pic4x.jpg 4x"
 alt="A rad wolf" width="500" height="500">

使用picture元素:

<picture>
  <source media="(min-width: 45em)" srcset="large.jpg">
  <source media="(min-width: 18em)" srcset="med.jpg">
  <img src="small.jpg" alt="The president giving an award.">
</picture>

我正在开发一个应用程序,要求我在Web浏览器中使用文本到语音.我正在使用HTML5语音合成.在谷歌浏览器上,代码运行正常,所有可用的声音都使用| getVoices()|列出,但在Firefox中根本没有列出语音.我在Firefox 56.0(Ubuntu)上测试我的代码.

在通过互联网搜索时,我确实遇到了一个StackOverflow 答案,该答案表明应该在| onVoiceChanged |之后调用getVoices()函数.事件

    window.speechSynthesis.onvoiceschanged = function() {
    window.speechSynthesis.getVoices();
    ... 
};

我正在以上述方式调用该呼​​叫,它在Chrome中可以正常工作,但在Firefox上则不行.

另一个StackOverflow回答建议我启用| media.webspeech.synth.enabled | 在about:配置Firefox,但在我的Firefox中首选| media.webspeech.synth.enabled | 已经设置为true.

我查看了MDN文档https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis/getVoices,此页面上的示例在Firefox中没有运行,但在Chrome中运行良好.我发现CanIUse.com列出了Firefox 55以后支持的SpeechSynthesis,但它对我不起作用.

还演示由Mozilla开发者网络来演示语音合成失败对我的Firefox浏览器,但在谷歌浏览器运行正常.我在网上广泛搜索了一个解决方案,但找不到一个.有人可以在这里指出我正确的方向.