乐鱼体育HTML怎么加图片?

2024-05-24

  再简单的问题,可能也有新手小白不会,丁鹿学堂勤庸老师保姆式视频讲解在HTML中图片的添加,字幕内容如下: 首先我们新建一个网站目录website。然后把我们的网站目录拖到我们的vs code 上面。这时候用vs code的来创建我们网站的基本目录结构。比如说点这一个就是创建一个目录,新建文件夹,就是创建一个文件。那我们创建一个imgs的文件夹,放我们的网页图片,然后点这个+,在我们website 的这个目录下面,你就要点中website目录,然后再点添加文件夹c s s 样式的一个目录,再点回到这一个website 这个目录,再点加号,再创建一个叫js的目录。这就是我们网页常用常用的一个目录结构。三个目录分别装对应的内容。 然后我们再在website 的这个目录里面,建一个首页叫index.html。我们可以用vs code的快速的生成一个html结构,直接shift+!,然后选择第一个!回车键。这时候他就非常快速的生成一个网页的基本结构,就不用我们再去手敲。 注意!我们创建完这个文件以后,要习惯性的保存按ctrl+s 保存我们的创建的这个代码。如果你不保存,那你的电脑一关掉,或者你把这个文件关掉,你的代码就没有。所以说要习惯性的按ctrl+s 保存我们编写的这个代码。 我们在这个文件夹里,imgs的文件夹里放一张图片,也可你可以直接在这个目录里拖一张图片进去,这样我们imgs文件夹就有一张图片了。 我们引入图片是用标签,然后他有一个叫 src的属性。就可以引入我们的图片,这个img的标签它是单行标签。所以说在标签内结尾加一个 /,表示它的结束。然后src 就是图片的一个地址,我们图片是在这个imgs文件夹下面的logo.png。所以说我们把这个图片的路径给他写上就可以了。imgs是文件夹 / 下面的logo.png。我们安装了插件以后,自动都有提醒我们的一个功能,我们就把然后ctrl+s 保存,右键点open in live server。这时候他就自动在我们的浏览器打开了我们这一个网页,并且出现了这一个图片。 这个src 就是图片的一个地址,这是本地图片的地址。如果说你这个图片名称错了,他没找到这一张图片,这时候图片就显示成这种一个图片没出来的一个图标。 他还有一个叫alt的属性,alt的属性就是当图片显示不出来的时候,就显示alt 里面的文字。我们ctrl+s 保存,然后刷新点这一个圆圈,刷新一下。这时候你看图片没有显示出来,就显示了这个alt的文字。如果说你的图片是正确的,没有写错,那它显示图片的话就不会显示这个alt的内容。 我们src 属性除了给本地的图片地址,还可以给一个网络的图片地址。比如说在网上有这么一张图片,我们右键copy img address(复制图片地址)。然后我们再粘贴到src 的这个地方,这就是一个网络图片的地址。当我们ctrl+s保存再去刷新一下。然后我们进到这里就能看见这个图片显示出来了。


本文由:乐鱼app官方网站提供