img标签的 height 和 width 属性设置图像的尺寸:
提示:为图像指定 height 和 width 属性是一个好习惯。如果设置了这些属性,就可以在页面加载时为图像预留空间。如果没有这些属性,浏览器就无法了解图像的尺寸,也就无法为图像保留合适的空间,因此当图像加载时,页面的布局就会发生变化。
更为合理的方式:
提示:请不要通过 height 和 width 属性来缩放图像。如果通过 height 和 width 属性来缩小图像,那么用户就必须下载大容量的图像(即使图像在页面上看上去很小)。正确的做法是,在网页上使用图像之前,应该通过软件把图像处理为合适的尺寸。
最好加上替换文本属性(Alt)
alt 属性用来为图像定义一串预备的可替换的文本。替换文本属性的值是用户定义的。
在浏览器无法载入图像时,替换文本属性告诉读者她们失去的信息。此时,浏览器将显示这个替代性的文本而不是图像。为页面上的图像都加上替换文本属性是个好习惯,这样有助于更好的显示信息,并且对于那些使用纯文本浏览器的人来说是非常有用的。
可以这样: <img src="https://raw.githubusercontent.com/baibaibai66/Matplotlib/pictures/1.2.png" width="60%" alt="还在路上,稍等..."/>
这里设置width=”60%”比设置固定大小width=”400px”效果更好
可以到w3school img看一下。