Vue-img图片加载失败时显示默认图片

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Vue-img图片加载失败时显示默认图片相关的知识,希望对你有一定的参考价值。

参考技术A 正常显示userInfo.headPortrait,加载失败则显示上面的defaultURL图片。

图片img

插入图片img

img标签:<img src="logo.png" />

使用alt属性的值可以作为当图片不存在或加载失败时显示的提示文字,而且这样有利于搜索引擎搜索到你的图片,建议为每张图片都设置alt属性,这是一个好的习惯。也可以想a链接那样为图片设置title属性来设置鼠标hover到图片上是提示的文字。

技术分享图片

为img标签外包裹一对a标签即可把图片作为超链接,图片作为超链接在IE8下默认有边框,为img设置border="0"即可去掉边框

作为超链接的图像为其设置ismap属性,可以得到点击图片的坐标(相对于图片左上角),可以把鼠标hover到图片上查看状态栏的状态,也可以点击图片查看地址栏。

技术分享图片

也可以在图片上创建多个超链接,一般叫图像地图或图像映射,使用usemap属性,配合map标签

以上是关于Vue-img图片加载失败时显示默认图片的主要内容,如果未能解决你的问题,请参考以下文章

图片img

加载图片失败显示默认图片的办法

图片加载失败显示默认图片占位符

vue 图片加载失败时,加载默认图片

图片加载失败时,加载默认图片(未亲测)

JQuery图片加载显示loading和加载失败默认图片