首先,alt属性原本的目的是如果图片不能显示,就用这个alt属性的值去填充图片的那个位置。

但是IE浏览器的feature是,如果你mouse hover到img上,就会显示alt的值。但是Firefox和Chrome却是严格遵守W3C标准的好同志,坚决不做这样的事,也就是说,chrome和Firefox浏览器中,你把mouse hover到img上,是不会有任何事发生的。

然而解决方案就是加一个title属性即可显示title属性的值。

这个英文关键词叫做balloon text

<!-- does not show balloon text with mouse hover in Chrome and Firefox, but it shows it in IE -->
<img alt="Example of alt text" src="https://www.computerhope.com/logo.gif">

<!-- shows balloon text with mouse hover in Chrome and Firefox -->
<img alt="Example of alt text" title="Example of title text" src="https://www.computerhope.com/logo.gif">

你们可以感受一下。

标签: html, img, mouse hover, alt, title, balloon text

添加新评论