css - 使用 CSS 在伪元素上发出声音

Question

我读到一些让我大吃一惊的东西，我想问问这是否可能。

根据w3school docs content 属性可以采用 url 值，可以是声音 ?!

url(url) Sets the content to be some kind of media (an image, a sound, a video, etc.)

根据 MDN

The value is a URI that designates an external resource (such as an image). If the resource or image can't be displayed, it is either ignored or some placeholder shows up.

所以我试了一下

content: url('http://www.w3schools.com/html/horse.ogg');

什么也没有发生。我的问题是，是否确实可以使用 CSS 触发音效，或者这只是 w3schools 文档中的一个错误？

编辑:关于何时有用的示例:

当然可以用JS来触发声音，但是也有不允许使用javascript或者用户没有开启javascript的情况。因此，假设您向第三方网站提供一个元素，并且只允许使用 HTML+CSS(例如横幅)，如果 content 确实接受声音，则悬停时可以触发声音效果伪元素。

Answer 1

CSS2.1说

The value is a URI that designates an external resource (such as an image). If the user agent cannot display the resource it must either leave it out as if it were not specified or display some indication that the resource cannot be displayed.

老CSS3 Generated and Replaced Content Module工作草案 (2003) 说

if the URI is available and the format is supported, then the element or pseudo-element becomes a replaced element, otherwise, the next item in the comma separated list is used, if any.

较新的CSS Generated Content Module Level 3 editor's draft (not ready for implementation) 说的基本一样:

For URIs other than URIs in the last comma separated section of the value, if the URI is available and the format is supported, then the element or pseudo-element becomes a replaced element, otherwise, the next item in the comma separated list is used, if any.

所以看起来浏览器可能会决定支持声音并呈现为替换元素，如 <audio> .但很可能他们不会。