HTML中添加图片的代码是什么？html如何正确的添加图片路径？

首先我们先认识一下html中添加图片的代码：

html中添加图片的就是<img>标签，是一个单标签，是可以从任何地方拉来图片添加的，但是你得正确的确定添加图片的路径，不然就显示不出来图片，这就是我们今天要说的两个知识点。

我们先认识一下img标签的正确用法，这样才能确定怎么添加图片。

一般添加图片的语法如下：

> <img src="url">

如上，src属性是img中必备的属性，不然img就相当于没用处了，没地方放图片，那这个标签还要干嘛，所以，我们要知道html img标签的用法，这两个就是连在一起的，我们必须要一起使用才行。

还有我们本地制作HTML添加图片一般都是把图片放在自己的本地文件夹中，与html文件放在一起，一般都是一个文档，有一个html,还有一个文件夹叫img的是专门用于放图片的文件夹，我们一般都是把自己要上传的图片放到img文件夹中。然后我们就可以这么用img标签链接本地的图片了：

> <img src="img/1.jpg">

如上就是一般我们用img标签的用法，链接本地的图片1.jpg，把图片放到网页上。

现在我们来说说正确的使用路径吧：

上面说了，我们一般都是把图片放在本地的文件夹中，这样我们就可直接链接图片了，这样的办法是很好的，如何还向把图片美化的更好，建议使用层叠样式表css来实现，但是我们现在说的都是纯html标签和属性来实现的，所以先不说css样式了。

我们想象看，一般都是用<img src="img/1.jpg">,1.jpg这个是本地图片的名字，当然你可以随便的更改，这个都是可以的。这是我们最大众的用法。

来看看别的图片怎么连接，比如我们想连接别的文件夹下的图片，我们该怎么办呢？

让我们来看看情况使用的语法吧：

<img src="e:\wenjian\tupian\1.jpg">

这样就出来了，如上图，我们就连接到了e盘“wenjian”的文件夹下的“tupian”文件夹下的1.jpg图片了。

这也是一种常见的用法，有些图片别的文档也需要时，这样做是最好的，把图片放到一个容易找到的位置。这样就能一直用下去了。

还有一种就是链接网上的图片:

想要网上的图片的网址，就在网站图片上面右击复制图片网址。这样就可以把图片的网址复制了。

然后我们使用img标签来把图片放到我们自己的网页上去。如下图：

> <img src="https://img.php.cn/upload/article/000/000/003/5a9675a3b2106284.jpg">

这样就是可以调用图片放在自己的网页上来显示了，就是有点麻烦而已。大家可以多试试这几种方法

专门建立的学习Q-q-u-n ⑦⑧④-⑦⑧③-零①② 分享学习方法和需要注意的小细节，互相交流学习，不停更新最新的教程和学习技巧（网页制作，网站开发，web开发，从0基础开始的的HTML+CSS+JavaScript。jQuery，Ajax，node，angular框架等到移动端HTML5的项目实战【视频＋工具＋系统路线图】全栈工程师学习路线以及规划都有整理，分享给小伙伴）点：学习前端，我们是认真的

HTML中添加图片的代码是什么？html如何正确的添加图片路径？相关推荐

php图片滑动代码,基于mootools 1.3框架下的图片滑动效果代码_Mootools
效果预览如下: 实现原理: 容器采用相对定位,图片采用绝对定位,当鼠标移动到相应的图片上,改变去left属性,用tween实现动画效果. 代码分析:写一个picSlider类实现代码封装 CSS样式 ...
横图图片广告代码html,横向不间断的连续滚动图片/文字广告
横向不间断的连续滚动图片/文字广告 [ 发布者:未知┊来源:网页特效观止┊时间:2008-03-29┊浏览: 人次 ] 可自行设置显示比例横向不间断的连续滚动图片/文字广告-网页特效观止-网页特效代 ...
html网页图片滚动代码用css和div,DIV+CSS网页图片滚动源代码
DIV+CSS网页图片滚动源代码 style="overflow:hidden;width:500px;"> border="0"> id=&quo ...
【Python黑科技】图片太大不能上传？三种压缩图片大小的方法（代码注释详细）
目录实现效果原图大小8.46MB PIL库quality降低图片质量方式压缩图片366KB PIL库thumbnail压缩图片大小来压缩图片985KB OpenCV缩放图片大小来压缩图片 177K ...
vs 添加快捷键 | 修改快捷键、添加注释、添加快速插入代码(使用#if 0 注释)
文章目录添加注释工具快捷键自定义命令快捷键添加注释工具图标使用`#if 0`代替块注释为什么使用#if 0注释添加插入外侧代码工具使用快捷工具进行 #if 0 注释添加注释工具快捷键 ...
JiaThis™图片分享代码
JiaThis™"图片分享"代码: 您想将网站上精美图片分享到各大微博等社交媒体上,与好友一同分享吗?JiaThis 图片分享可以帮助您! 加入下面的代码后,用户将鼠标移动到指定的 ...
html图片滚动红点_HTML中更换或添加网站背景图片的代码怎么写？（示例）
本篇文章主要介绍了HTML代码中如何更换或添加网站背景图片?对于小白来说,最简单的方法就是,如果是更换背景图片的话. 我们可以在网页上点击鼠标右键查看网站源代码,然后找到css里面的背景图这一段代码, ...
php网页怎么插入背景图片,HTML中更换或添加网站背景图片的代码怎么写？（示例）...
本篇文章主要介绍了HTML代码中如何更换或添加网站背景图片?对于小白来说,最简单的方法就是,如果是更换背景图片的话. 我们可以在网页上点击鼠标右键查看网站源代码,然后找到css里面的背景图这一段代码, ...
python使用视频_Python中操作各种多媒体,视频、音频到图片的代码详解
我们经常会遇到一些对于多媒体文件修改的操作,像是对视频文件的操作:视频剪辑.字幕编辑.分离音频.视频音频混流等.又比如对音频文件的操作:音频剪辑,音频格式转换.再比如我们最常用的图片文件,格式转换.各 ...

HTML中添加图片的代码是什么？html如何正确的添加图片路径？

HTML中添加图片的代码是什么？html如何正确的添加图片路径？相关推荐

最新文章

热门文章