html - 网络套件。将鼠标悬停在图像 'alt' 上不起作用

Question

我有非常简单的 HTML 代码

<img class='star' src='' alt='&#9733;'/>

非常简单的风格

.star {
    position: absolute;
    cursor: pointer;
    font-size: 40px;
    color: black;
}

.star:hover {
    color:red;
}

我的idia是这样的。如果服务器上没有图像，我会显示 unicode 星号(或者如果用户将关闭所有图像)。如果一个用户

它在 FF 中完美运行(在 FF25 上测试)，但在 WebKit 浏览器上非常失败。悬停状态不会触发或触发，然后永远保持该状态。

我只有一个问题.. WTF 是什么？ o_O 我哪里错了，或者这只是一个 WebKit 错误？

如果有人告诉我如何解决这个问题，那就太好了。但主要是我想了解这里发生了什么。

附言:示例 http://jsbin.com/UMIrAJI/3/edit

更新:

此示例有效 http://jsbin.com/UMIrAJI/5/edit但唯一的区别是悬停时“背景”颜色发生了变化。一旦我们删除“背景” - 悬停就会停止工作。哈哈。

所以我的问题仍然有效。这是怎么回事？

UPD2:

我找到了另一个解决方法。如果我们添加 border: 0px solid white; (但仅在悬停时)示例也将开始工作 http://jsbin.com/UMIrAJI/6/edit .所以这是关于重新粉刷的事情。

UPD3:对我来说这看起来像是一个错误，所以我报告了它。我会等待开发人员的一些评论。

https://code.google.com/p/chromium/issues/detail?id=323545&thanks=323545&ts=1385479799

Answer 1

对于不支持图像的浏览器和辅助工具，使用 title 属性代替 alt，它应该描述图像的内容

<img class='star' src='' title='&#9733;'/>