web前端img标签

img标签是用来显示图片的,下面我将根据一个小案例来介绍他

很显然 单凭一个img我们不可能显示出想要的图片,必须要结合相应的属性,其中最终要的就是路径了,它代表着我们想要显示的图片所在的位置相应的,大家应该都知道,路径分为相对路径和绝对路径而在html的语法中,这两种路径的用法与编程中有着一点点的区别

说了这么多,下面就看看最简单的效果吧首先给出图片和当前html文件的位置

可以看到如果光光这么写的话,显然出现了图片显示的问题

为了解决这个问题,我们可以使用 img标签的宽高属性, 很显然,这是用来改变图片的大小的

只要微微加两个参数,热巴的图片就展示出来了

接下来看看外面的要求,还需要修改边框属性,只需要加个border属性就好了

这里为了效果的展示,我把它设置的比较粗

最后我介绍一下alt属性,它代表的是如果没有找到对应的图片给出的提示比如我故意设置错一个路径,我们看看效果